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Abstract 


"This specification defines the features and syntax for Scalable Vector Graphics (SVG) Version 1.1, a modularized 
language for describing tvvo-dimensional vector and mixed vector/raster graphics in XML. 


Status of this document 


This section describes the status of this document at the time of its publication. Other documenis may supersede 
this document. A list of current VV3C publications and the latest revision of this technical report can be found in 
the V/3C technical reporis index at hitp://v”v”vv.v”3.org/ TR/. 


"This document is the 16 August 2011 SVG 1.1 Second Edition Recommendation. The Second Edition incorporates 
a number of corrections that vvere published as errata against the First Edition, as vvell as numerous other changes 
that help make the specification more readable and unambiguous. The Changes appendix lists all of the changes 
that vvere made since the first Proposed Recommendation publication of the Second Edition. For all changes made 
betvveen the First Edition and the Second Edition, see: 


e Changes betvveen the SVG 1.1 First Edition Recommendation and the first Last Call VVorking Draft of SVG 
1.1 Second Edition 

e Changes betvveen the first and second Last Call VVorking Drafts of SVG 1.1 Second Edition 

e Changes betvveen the second Last Call VVorking Draft and the Proposed Recommendation of SVG 1.1 Second 
Edition 

e Changes betvveen the Proposed Recommendation and this document 


Comments on this Recommendation are vvelcome. Corrections against the specification vvill be published as errata, 
and subsequently vvill be incorporated into future editions of SVG 1.1 or into SVG 2.0. Comments can be sent to 
VVVVVV-SVg övv3.org, the public email list for issues related to vector graphics on the VVeb. This list is archived and 
senders must agree to have their message publicly archived from their first posting. To subscribe send an email to 
VVVVVV-SVQ-request(övv3.org vvith the vvord subscribe in the subiect line. 

The VV3C SVG VVorking Group has released an expanded test suite for SVG 1.1 along vvith an implementation 
report. This test suite vvill continue to be updated vvith nevv tests to improve interoperability even after Recom- 
mendation phase. 

This document has been produced by the VV3C SVG VVorking Group as part of the Graphics Activity vvithin 
the VV3C Interaction Domain. The goals of the VV3C SVG VVorking Group are discussed in the VV3C SVG Charter. 
The VV3C SVG VVorking Group maintains a public VVeb page, http://vvvvvv.vv3.org/Graphics/SVG/, that contains fur- 
ther background information. The authors of this document are the SVG VVorking Group participants. 

This document has been revievved by VV3C Members, by softvvare developers, and by other VV3C groups and 
interested parties, and is endorsed by the Director as a V/3C Recommendation. İt is a stable document and may 
be used as reference material or cited from another document. VV3C"s role in making the Recommendation is to 
dravv attention to the specification and to promote its vvidespread deployment. This enhances the functionality and 
interoperability of the VVeb. 
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"This document vvas produced by a group operating under the 5 February 2004 VV3C Patent Poliey. V/3C main- 
tains a public list of any patent disclosures made in connection vrith the deliverables of the group: that page also 
includes instructions for disclosing a patent. An individual vvho has actual knovvledge of a patent vvhich the indi- 
vidual believes contains Essential Claim(s) must disclose the information in accordance vvith section 6 of the VV3C 
Patent Policy. 


Available languages 


"The English version of this specification is the only normative version. Hovvever, for translations in other lan- 
guages see http:///Vvvvv.vv3.org/Graphics/SVG/svg-updatesytranslations.himl. 
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8:5:2 İnterface SVGPathegGlosePaiiz oo is əya yaya əd Do Yap əb dakı 216 
8:5:3 Interface SVGPathSegMəovelo2b. sz da ısı əbası dd db asdığı 216 
8.5 Interface SVPathSegMeyetoRel. oo aş azan yy pda za şap pş ışd oma gi ğı şə 217 
8:55 İfiterface oyPalhoeziinetoAlsı ə Umid aaa sada dalda al aaa mı dıs 217 
8:5:6 Interface SYEPathseglinetoRel .-suzü saol dodo Şad o ğaıyama dı doğula 218 
8:5:7 Interface SVGPathSegCürvetocubicAbsı əə sizma as lış Su buda dama nalı bd 219 
8:5:8 İnterlace SVSPatısesCurvetoCubicBel, Ul əesəy əə abay a dB aa pa Amma yala dıb asi dA 220 
8:5:9 Interface SVGPathsezCurvetoğuadraticAbs, i.a əla sy ə RAD RAR as 222 
8:5:10 İnterlace SVGPathSegCurvetoğuadratieRel ə əəə əy səda aa bz sa DR ay aada RAR Şaləsdi 223 
8:5:11 İnterfiace SVGPatliSeyATcAbs zə ya py Raya bal ayı aad a başda basi 224 
85:12 İnterlace SVGPathSegArçehel..əəə əəə za dd aaa yadı Rada Baqi sı 226 
55.19 İnteriace SVGPalhSeglinetollərizontalAbsız- ə süzə ea aa ya da pə Bi dikə saa 228 
8:5:14 İterlace SVGPathSeglinetoHərizomtalRel- və əUü əyyamı dayıya daaaddasq 228 
8:5:15 İnterlace SVGPathseglinetoVerticalAbs ...əuo əyə ya pş ladı yad ay ya pop ds 228 
8:5:16 İnterlace SVGPathsegkinetoVerticalRel... ə. ə yaaa dd aad də baş yala aa dadıbdıdə 229 
8.5.17 Interface SVGPathSegCurvetoCubicSmoothAbs. .................................2.... 229 
8:5:18 İnterlace SVGPathSegCuryetoCübieSimoothRel ..cəu əsəs aaa s dayə pa gaebadas 230 
8.5.19 Interface SVGPathSegCurvetoQuadraticSmoothAbs .................................. 232 
8.5.20 Interface SVGPathSegCurvetoQuadraticSmoothRel. .................................. 232 
85:21 İnterlace SVGPathiiSeglistt əsə ea yy aaa aa aa be Ağı saya Bı sadə 283 
8:5:22 İnteriaçe SVGAmımatedPatlıbata əy ea əşya Sas s ıb bə 237 
85.23 İnterlaceVGPatiElemefit əəə dy aaa a BR R əl a RUB 6 piyi mb sbaiba 238 


9 Basic Shapes 


Qol lnirodluctiDin saa yaladı ayb aa dad daş ao da əd payı dalıa zala Di 6 ob so barı baraııbaşb.q:ğ 249 
9:2 The "reet element əsəb BELL ala Pa aşa dxaaş dı payı adad day dm pb 250 
9:5 The “cirele elememnit--soə aaa rada a şala yaya pad da aa ABŞ 253 
9:4 The ellipse element.o əyyar PR aç op ab Tab aa a Ya bd 255 
005:1h£ line € mens ada daaa da ao ə a əda add a 257 
9:2 The “polyline” elemeni. ez r aaa dad bd da aşsa şala dadə əbdnşasə 259 
271115 polygon eleme a a a La Əba aasıdabə 260 
9.7.1 The grammar for points specifications in “polyline” and “polygon” elements ................ 262 
9:5 DOM” imleriases əə a ənə ə ad oa a a aya aa Bozla saka əd aka blky 263 
9:8:1 müerface SVGRectElement ..uə əə əə baya b Aya a adla sak a Buda Bəpaa Başar q kapi işars 263 
9.8.2 Interface SVGCircleElement ....................................................... 264 
0:8:5 İnterlace sVGEllipseElemefit sözə cə yşıya ŞLa R R RA A aşa daya Eəaibə 265 
9:8:4-İnterface SVGLineElement uu əə a da yaa payda Rok da akad dadda R RUR aadıd a Bala gə 265 
9:8:5 Imüerface ŞVGAnimatedPoints .e üə əş yapa aşa qdıaaoddığ ə dı qabığa Bağa dy sobsıd 266 


9:6:6 İnterlace əyioPolylirisElsimenb əza yədə daaa ə Pal iyə 267 
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0:87 İniterlace SViGPolysonElemente əəə yaşada iş ama a m Rada Rabba dip 5 be Paəaəprə 267 
10 Text 
10: İntroducliom. əəə asa aaa aa yy op ls qıp adı eşya 269 
10:2 Charatters:and iheir corresponding gİyphs:su əə ə za da sabab aa ıb 9 daxdayddubbd-bə 270 
10:3Föntsz Tonttables and baselinei sə əəə suz aaa yaln ə o asa A a as Dayı dağa 271 
LA Le text elementə səs ao ma 3 şa şa aşya məsa 272 
110:5: The” töpam elementə əəə de ba dA daşdı oya yıb aaa ğa 276 
dul bıı qışı qı arıq 16677750075660660700070050505007 77”. 287 
quraraq): —”””.— 288 
10:7/1 Text layoutintrodusdsmuua yanana daa daa kalla əba aşıb Baabq 288 
10.7:25etting the inline-pregression-direetlon: əəə əəə əə aaaaba PaRanləsı Ps dıqıRapaeşıds 290 
10:72 Glyphonentatllon ithin a testini əə se yday a RA Rap asla ə ədl 291 
10.7.4 Relationship vrith bidirectionality ..ccəəə ə ə sezə a yı Rap aba aş Q yaomayəsiopəs 294 
T0:5 Texireniderins order suuuy yoza sea aa da sab dalda lala aaa 296 
HALƏ. ıluumnıfa qoğqouluqıı..0 00 050750657505070071701007777757 7 77 ”””” 296 
10:21 Testbalikniməent Properties əə oya ə ba daş day maoB pək BAŞI aradı baybar Bısədlaypa 296 
10:22 Baseline-alighmentipropertiesiieə oz esdı bad asedap ağalar danağı əd 25 )3-bü 297 
10:10Font selection properties:-i su saza iyn qrız Bal Ba pa R dyp aad ab Rob dş 305 
ÜTT :Soacın£ propetileseoo əs odda odu da bı da baa adalarda aruq 308 
Tur doq pılıuııııııl.) 0000008000 7”. 310 
ük a ııı 60510777-05411010777700505“40v065607vğ ?77 7” ”. 312 
10:13:1 İntrodüetlon 16 texton apath-/əı ə ee PR Şa ıı şampan əyər b aş adonssbə 312 
10:19:07 The texstPatli elemehit. ə əya ed aaa sa pa Ra RA Dadı RO adana 312 
10:15:53 Textbon A path laycubrüles ə o dı dadda dd adadddıbd axışdı maa adabayni 317 
Muraz aşaqı ——”.”” 320 
dü he alıeiyplu elden ca əə Lə Be aye raq S laya Şiə 320 
10.14.2 The “altGiyphDef”, “altGlyphltem” and “glyphRef” elements ................ ............ 323 
HikİŞ V/hite: space handlıbğ ua zy sa Ba bdyadaıbs dadda Loqos odla so şad ə 326 
10:16 Text selectiomand clipboard eperatiors . Ucu əya ib ay s ay R Şey dəkşaş Rydıbu şax 328 
qar ıb 0 yıraııı65600660060700077 7 7  ”””” 329 
10:17 1İnterface sVGTextContentElement: əəə əəə qayda a Rays BAR BL a dad şu 09 9-33:59 329 
10:172 Interface Vo estPositioningElement. on sa aa aca Ra DR aba 334 
10:17:53 İnterface SVieTexiElemenifeə yə ey daaa q BR BR ERYƏ R ERİ PyıAYŞ yiRaRa ala 335 
10:17: interfacesVElspanElement əəə ə a aaa a yaaa AĞ BALI ıdı 335 
10.17 İnterface SVGTRetElement..eəə--əə əsa ada dadı ay PR sarıb R Ə-Rıbıbq 335 
10:17 Interface VO TestPallıElement ə YAS Pa ar ye Da a Radə 335 
10:17/7 İnterface SVGĞATGİyphElement:.iə əə ayy RR Eda ŞAR ağa Bi dasora iy asilıaşrəq 337 
10.17:5 Interface SVGATGIypbDeftElement səyə əsa şaya Ra dərə badına bada dau 337 
0:19 interface SVATIGİypbltemElement əəə sd b dadda addı Ba dəb şı a abdddabbd 337 


10:17:10 İnterfacesoyGiypuRetElement əəə şaıpo aya yd SR aa Bə m şap bak db 0ıboys 338 
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11 Painting: Filling, Stroking and Marker Symbols 


Ts ınşalı ür ıl ışını05088895055750 577 6000000000 340 
düs ılıq qı qoru11060550005060000607:77777)7— 5.” 341 
qı allı uupılaqııı.)66060606650606606060500107575777 7” 342 
EŞ ayaqa aşıqı... 0007070107  ”.” 344 
"1:5 Controlling yisibilili Vəə əəə ed Ra pp a ŞUR s ğa balə əə aşık Şe zəy oŞə 348 
YERD 00610060060660600 17”. ””. 350 
iludoladışmılıdııı..)n66045565656067060606075657 7 77”: 350 
11:5.2 The “marker element... ou a ao do adada a adada BAR maa bə 351 
HS quşdu qı ..00060600567600640706065070707 777.” — 355 
11.6:4 Details oni hor markefş”are renderedi ecə syani marşını a op RAR b darssubda 356 
iHU7 Bendering pEperiesi: ooo oz R ba Add maya lan Ya R Rab a ara 358 
11.7.1 Color interpolation properties: “color-interpolation” and “color-interpolation:-filters” ......... 358 
11.7.2 The “color-rendering” property .......................... oo əə 0 əəə sk kssb. Ri 360 
11.7: The shape-rendering “DTOPETİY. nə a a seda a şa saka yaba peyda səksəbə 361 
11.7:4 The "text-rendering bTOpeTİY ilə oa ə ə q ala sz Ra iy sa adıma kas payı ekaob ana 362 
11:75 The image-rendering” bfoperiysus ııı saa dadda daa dü dada 4 “s başaladı ub dənə 362 
T1:5 mheritance oh paintirig propertiebu o ooo dada RA Bayan bını b sd daşda para b ssni 363 
"BEB ludıaqııııı.ı““6600050505000050707777 7 777 7 7 364 
İL0 1 İniteriace SVEElinbcəə maa dıl dıl ada la dası Oboy q Payı 0döbə 364 
11:9:2 interface SVGMarkerElemehnt::--ə əəə dada baa Ra R aleme piboy bilərsə 367 
12 Color 
12 İnitodurlaneaə baə ə asa ına Yapı Daə 370 
dip dıl du lıladq ooo q (0005000000 77———” 370 
12:35 :Color profile:deseriğtions. eee R r ee R Bal şa yl R Biş-a oba QAZRILEarpalas 371 
122:1-Overvievc of goler profile descriptions: uy əya Zadə aa aa Re pla Ras palpaməlləbə 371 
12.3.2 Alternative vvays of defining a color profile deseription ............................... 371 
125 117 coloreprofile ElEthenioo ə a daa əəə a a da day 371 
1237 The (55 (öcolor-profilerule,.ə əəə əmə yası a ə Ra aaa 373 
12:55 The “eelor-profile” Droperty və əəə see yala pa ea R a DAL DB şsk BB YİBŞ-dapbayii 375 
12.4 DÜM interfaces ə ooo ad saka Baş ÖR a aş pb saya aa bb a a Lp pp po sa Yal kaş 376 
12.2 1.İmterface:SVGCelorProfileElement:.. ə əda a dede RAR RAR Ban abla əuklukala 376 
12:4:2 İnterface SVGColorProfileBüle..ıUcəə ə zəy dp sapa PAR Res sed RRy eYE Bağ Rab isə 376 


13 Gradients and Patterns 


İİ İR Toduclaii oa las b La əla la aa daq 378 
115:2 Gradienis use ıb abad daddı b aaa Babaş Aaaa ad sarıq 378 
HEFPS M layı uf 0 Şad 0071000070 0000000000 000 378 
113:2:2 Linear gradienis suya adada ba dalda dazı aşma Badu dəb bığı dy 379 
qoya amnllıpıılınıı605005305006060006010060700607657567 777” 383 


qedar izdı onlışı)6060:00 0007065066 77” ”..::) 386 
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HE (s 1060800 070300- 0000089000 0000070000 0000000000: 0000000000 388 
1100 DOM inferiate Yə adə əb Də S Era oba anı 393 
13:4.1.nteriace SVGGradientElement... Uu əəə əə ə ay R pad APARAR a ebay pşsşukad 393 
13:4:2-İnterface SVGLinearGradientElement əəə ə əə yaaa a YR ea s yaa aıb bə 394 
13.4.3 Interface SVGRadialGradientElement .............................................. 395 
134 interface SYGstopElement əəə yəyə əş yaa a dadaş pu da pışasıpus quşa pa pa duşa 396 
12:55 interface SVGPattemkElement. əyə ə asa ada aaa şala yoldakı a Ud əbədi ə3 396 


14 Clipping, Masking and Compositing 





del ucal nı (00:(506055165050505607””—””—”..”””.””,. 398 
2:7 Simpieiphacompositingk..əə əsə saa ssa əya R ğa a dadı a a dz 398 
3 ll aşına ı33100050060050050007””—.—.—— 399 
qeçlılqıılınldınıq 0 —0x15050000000007070007070007071017“7:) 7070747 P107 17353”) 399 
14:72 The initial celipping pathı:..əəə əəə yay ə adada Dadı Babaş sra ud səpib 399 
14:33 The overflov” and” clip proğeries-əəə ə ə aşa dəs asla əəə 400 
14:3:4.Clip io"yloyperivs: Elip to YEYBOx a aaa aa Rays Rab iə 401 
14.3.5 Establishing a nevv clipping path: the “clipPath” element ............................... 401 
14:3:6 Çlipping paths, geometry, and peinter events: Lü nəə esq dayalı oLa baaad a deya 404 
HESUMALDII4010000660606060606050777””” 7” 405 
14.5 Obyect and group opacity: the “opacity” property ........................................... 409 
HESA EYB aluqruqııuı.ı01000007777007700507 77 7 7 411 
14:6:1 interface SYGClipPathEleiment... əza qıysa andı BL ŞIRaRa dışı bada s dila alar -edrira 411 
1:5 2 interface SVEMaskElement.sə səna adası dağs bab dağ ard POD dəPay0 səda op 412 


15 Filter Effects 


qra ııpoylıbılıı166006066060606605000077 7777 415 
qa oışqın ooşıurıı...10007550507000v707 PÇ“ € Ç v 0. 416 
15:52 Te filter elemenisəa adı əş RAD dd ma dubla 418 
115:4 İle “filter” “DTODETİY A ao b yaln paya R BR yapa daş pası qaz ağabı o R ayeR a Daə 420 
5:5 Filter GHƏei5 Teglof. uu ıdı pod apa ada papa yaaa şı başıdı zoş 421 
15:6:A6cessing the background imağe.əəə əsa ə ıl paşa sı bal damdı did dəbdə 422 
115:7 Filter primitiyes OVETYİEYF əə əma zə Saşa daşa By adıda op LEŞ şap baya qaşıPssŞR 426 
qonub daycıyalyııını6055507060606000770267“7 7” 426 
15:72 Common atiribuless a a aaa ıı a b ALDA aa də 426 
15:7:5 Filter primitiye Subrekitmuə əəə yaşda aa R ad RA Ra adaşdən Ap maəşd obadaıı 428 
15:8 Light source-elements.and Properties kələ esre dayna yasa Aa Radara b dADŞ aa Bey pi BRB Bas7i-3 431 
15 1 lhuduslufc a a ay R əra ə 431 
15.8.2 Tight source feDistantLight” cüzam yada pi eleyəə giz Ryu arar gabuşob gös 431 
15:5:3 Liglit:sturce TePointlighit eee YR R RAR BRAD O mid AşR lış işabyasaLA 432 
15:82 Lighit source TeSpotLiglit soya saq aşı də pp aş dud Po alnı aa 433 
15:8.5 The “lighting-celor” Property... .əü ua pp daaa edln qa ydak lb ış la pa dakaş BR db 435 


5:9 Filter primilivə Tebleni uy ayə aa aydaa adıda 435 
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15:10 Filter primifive TeCelorMatrik Vəə sal R a ed Ba Re p-aığ Padığaş-d puBiR-sa dibə 438 
15.11 Filter primitive feCeomponentTransfer” Vu -ləə əə səsə aa bəm bd saa zarda Ra BiR əsids 441 
15:12 Filter primitive TeCompesite” ...u əə bəşər sada pz bu dq pl R R pla Eş Rs yaa pıpalR Ru by pal asa 447 
15:13 Filter primitive TeConvolveMatrix” ..:..Uə əə pipisiR a sap ə sas m dip dai sad 2 0 kiğ uk ya 2 op Reid məipa 452 
db. 14-Fillerprimili?a TeDiffuseliziilinz "Uu oz an RAR Rə R əda ası aaa 456 
5:15 Fillerprmiti?? TeDipieemenutMah sezə əz əsa a R Sa yaa Pay aa baya əə 460 
15:16 ilter Prumiliye Tellood uza aa ıdı a dd 1 005 099 dd 06 013030 9 31090 0 9 əb 462 
15:17 Filter prümiliye TeGaussianBlür eda aaa a Pol A aşa ey basp q ap sığa 463 
15:16 Filter primifive Telmağe .. .uaə payda ış a R aş şığıdı aığışab-pday alqı boyabs poıa iba arpoidə 465 
15:19 Filter primifive TeMerge əəə de Şa Ra R yada bay Dd şe pa- Qa BIR Pa pis 467 
115:20:Filter primitiye TeMorpholegy “üə A a da pada daa b maa aydaa 20 boya adıda 468 
15:21. Filter prumitive TeOfiset əə ə ə ida sy dB ap ağB a dy o daşıdım sz balkan Pes yposabaş 470 
İb: iller prmilbe TespecularlziMinE əsəb ARA Yaa ARA dada baa 472 
15:27 ilter prumiiiye Telile ey aaa anal Yaa əba a bU Ra RƏR AU 474 
15:22 ilter prumiiye efTurbülense ual da aad ald ıb bad pada BR a ıdı2 0 ə 475 
15:25 .DÖOM:ifterlacebi oo a sı adaş aa maa ııı pada ssa Raaıama od alıb ds 481 
15:25 1 İterface 5VCFilteTEleileht: və sas əş adla R bd şa saad ğa duş o ada 481 
15.25:2 Interface SVGFilterPrimitiyeStandardAttribütes:..u əəə aye sağı yaşdakı aad a Rada 482 
15:25: Enterface 5VOFEBlendElememit,y ionu saa Ra R R aa baa adadan ısə 483 
15.25:4 Interface SVGFECelorMatrixElement: ...əsəüUəa ee əya dı ada god adla alıb 3 də 484 
15.25:5 İnterface SVGFECompenentTransferFlement:...əəəə iə esə abad ideya yab 486 
15.25.6 Interface SVGComponentTransferFunctionElement.................................. 486 
15:25:7 Interface SVOEBFuneRElement... əəə yaaa PR sa ə daa bü b dapdohə ə 488 
15.25:5 müerfacesovoPEPunceelPletenk. əəə ənə Ra AA a aa BR ada BA ya abı 488 
15:25.9 Interface SVGFEFunebElement:. zinə baə ə daşıb daş ada aşa daa) $ 488 
15.5 nteriaee OPE uzel Eleme o daş a da ly sl lsı 488 
15:25:11 Interlace VE ECömpeositeBlementu asya aba aa sado saələrıa 488 
115.25:12 Interface SVGFEConvolyeMatrixElemeht :.: səna pada iya po ko APA YALudə 490 
15:25.15 Interlace SVGFEDitluselightingElement:...-ıə əəə ad ada Azda dada dala asyybə 492 
15:25:14 İnterface:əVGFElbistantLightElement esə əza aya daş damda RarD bı ob saşab isi 493 
15:22.15 interiacesV GE EbolmikiehtElement səs ea əd ebay boyalı ayağa dı? 493 
15:25:16 İnterlaceViEEspetbighiElement.uv əə yesə dy ayda bas ZO aeRa 494 
15.25.17 İnterface:SVGFEDisplacementMapElemermi......20 00-ə sk ad papa Rəd yayla 495 
15:25:18 İnterface SVGEEFleodElementu--əə əə pə ə SRdaa a ıdı Bığ da bd Ray basa 496 
15:25:19 nterihee VoyEoausanblurElemneni:. zə əə ay aa əs ə Sa saylarına 496 
15:25:20 İnterface SVGFElmageBlementi:...əəəə dı dolaş ER Ab amle ŞAR ə pla ə miğ ə lokərə 497 
15:25:21 interface sVGEEMerseblemenit....cə əə üs aaa Aaaa R BR a papası abba 498 
15:25:22 İnterlace SVGFEMergeNoedeElemente-e-e əəə əə əks Pad am sayı Pi Aeqşəkieə dii 498 
15:25:23 Interlace:SVGFEMəorphologyElement:.ə əəə yaşa payeD RU Bosşuy a dB UR pz 498 
15:25:24 İnterface SVGEEOfisetElement::....ə əyə əə şasa pada alda də kadıdaduobas 499 
15.25.25 Interface SVGFESpecularLightingElement. ....................................220. 500 


15:25:26 intertace SVGFE HleElement.. s.ə... də dadə ad ps bə od d su bəzi 501 
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15.25.27 Interface SVGFETurbulenceElement.............................................. 501 


16 Interactivity 


ieyılısınpolıb alı aşaran00000000070060077070007000607067077)77r r 0r070r rır 00 504 
6:2 Cömiplete listof suppertet beyenib ao a a ba dağa sab balda bd hamada sad Rab 505 
15:3 Liber inlerface Yes. cə ea lad pa şad pa aa MƏR ya adaş qam da şə 509 
UR Pqoluırosa30000000750 55... 510 
16.5 Hit-testing and processing order for user interface events ................................... 510 
TEZ duq Oşlulıl... 0 60600050000007000777“ 7 7 B?”— 510 
16:5.2 Evenhiiprocessini Lə aaa aa ap adası day pudu ıı panda 511 
115:6 İLie “pointerevents” PTƏperieeea ə asa aa al daya yay b ya aban 512 
116:7 Mağfüllication"and baftining sulu lada adaya a ağdan a ada RB paşam ayib 514 
HEM. 1.11030080805060506060601 7 7 -—”-” 515 
15:53: İmiroluehon te UTOTSau aaa aa apa R apa Bala BL aa 515 
qu dıra full aşı qn”: 515 
15:83 The” cursor Eleieht.. yuz a şayış papa daaa myaRda R yad şa oy up yz quaplaışa 516 
115:9 DÜOM.interiades: ia bə daa sada oa aa BR aşa daaa yaşa aş da ayı bayadəb nədə 518 
18:9:1 Interface SVGCurserElemenit o cə saba daaa abad dayar Basa 518 
17 Linking 
sila ul 07 07 000078090000700000000000000000202 000000 00 519 
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Appendix O: Feature Strings 
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1 İntroduction 


Contents 


1.1 About SVG 

1.2 SVG MIME type, file name extension and Macintosh file type 
1.3 SVG Namespace, Public Identifter and System Identifier 

1.4 Compatibility vvith Other Standards Efforts 

1.5 Terminology 

1.6 Definitions 


1.1 About SVG 


"his specification defines the features and syntax for Scalable Vector Graphics (SVG). 

SVG is a language for describing tvvo-dimensional graphics in XML TXML10l. SVG allovvs for three types of 
graphic obfects: vector graphic shapes (e.g., paths consisting of straight lines and curves), images and text. Graph- 
ical obiects can be grouped, styled, transformed and composited into previously rendered obiects. The feature set 
includes nested transformations, clipping paths, alpha masks, filter effects and template obiects. 

SVG dravvings can be interactive and dynamic. Animations can be defined and triggered either declaratively 
(i.e., by embedding SVG animation elements in SVG content) or via scripting. 

Sophisticated applications of SVG are possible by use of a supplemental scripting language vvhich accesses 
SVG Document Obieet Model (DOM), vvhich provides complete access to all elements, attributes and properties. A 
rich set of event handlers such as “onmouseover” and “onclick” can be assigned to any SVG graphical obiect. Because 
of its compatibility and leveraging of other VVeb standards, features like seripting can be done on XHTML and 
SVG elements simultaneously vvithin the same VVeb page. 

SVG is a language for rich graphical content. For accessibility reasons, if there is an original source document 
containing higher-level structure and semantics, it is recommended that the higher-level information be made 
available somehovv, either by making the original source document available, or making an alternative version 
available in an alternative format vvhich conveys the higher-level information, or by using SVGs facilities to in- 
clude the higher-level information vvithin the SVG content. For suggested techniques in achieving greater access- 
ibility, see Accessibility. 

SVG 1.1 is a modularization of SVG 1.0 fSVG101. See the Document Type Definition appendix for details on 
hovv the DTD is structured to allovv profiling and composition vvith other XML languages. 


1.2 SVC MIME type, file name extension and Macintosh file type 


The MIME type for SVG is "image/ svg-xml" (see XML Media Types IRFC3023)). The registration of this MIME 
type is in progress at the VV3C. 

It is recommended that SVG files have the extension " .svg" (all lovvercase) on all platforms. It is recommen- 
ded that gzip-compressed İRFC1952) SVG files have the extension " .svgz" (all lovvercase) on all platforms. 
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It is recommended that SVG files stored on Macintosh HFS file systems be given a file type of "svg " (all 
İovvercase, vvith a space character as the fourth letter). İt is recommended that gzip-compressed SVG files stored 
on Macintosh HFS file systems be given a file type of "svgz" (all lovvercase). 


1.3 SVG Namespace, Public ldentifier and System ldentifier 
The follovving are the SVG 1.1 namespace, public identifter and system identifter: 


SVG Namespace: 
http://vvvvvv.vv3.org/2000/sv£ 

Public Identifier for SVG 1.1: 
PUBLIC "-//VV3C//DTD SVG 1.1//EN" 

System Identifier for the SVG 1.1 Recommendation: 
http://vvvvvv.vv3.org/Graphics/SVG/1.1/DTD/svg11.dtd 


"The follovving is an example document type declaration for an SVG document: 


x DOCTYPE svg PUBLİC "-//03C//DTD SVG 1.1//EN" 
"http: / /vuv .v/3.o0rg/Graphics/SVG/1.1/DTD/svg11.dtd"s 


Note that DTD listed in the System Identifter is a modularized DTD (i.e. its contents are spread over multiple 
files), vrhich means that a validator may have to fetch the multiple modules in order to validate. For that reason, 
there is a single flattened DTD available that corresponds to the SVG 1.1 modularized DTD. ft can be found at 
http://vvvvvv.vv3.org/Graphics/SVG/1.1/DTD/svg11-flat.dtd. 

VVhile a DTD is provided in this specification, the use of DTDs for validating XML documents is knovvn to 
be problematic. In particular, DTDs do not handle namespaces gracefully. It is nof recommended that a DOCTYPE 
declaration be included in SVG documents. 


1.4 Compatibility vvith Other Standards Efforts 


SVG leverages and integrates vvith other VV3C specifications and standards efforts. By leveraging and conforming 
to other standards, SVG becomes more povverful and makes it easier for users to learn hovv to incorporate SVG 
into their VVeb sites. 

The follovving describes some of the vvays in vvhich SVG maintains compatibility vvith, leverages and integ- 
rates vvith other VV3C efforts: 


e SVG is an application of XML and is compatible vvith the Extensible Markup Language (XML) 1.0 Recom- 
mendation EXML101 

e SVG is compatible vvith the Namespaces in XML Recommendation EXML-NSİ 

e SVG utilizes XML Linking Language (XLink) TXLINK) for TRI referencing and requires support for base IRI 
specifications defined in XML Base İXML-BASEİ. 

e SVG content can be styled by either CSS (see Cascading Siyle Sheets (CSS) level 2 (CSS2)) or XSLT (see XSL 
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Transformations (XSLT) Version 1.0 (XSLTİ and XSL Transformations (XSLT) Version 2.0 TXSLT2)) See Styl- 
ing vvith CSS and Styling vvith XSL for details. 

e SVG supports relevant properties and approaches common to CSS and XSL, plus selected semantics and fea- 
tures of CSS (see SVG“s styling properties and SVG/s Use of Cascading Style Sheets). 

e External style sheets are referenced using the mechanism documented in Associafing Style Sheets vvith XML 
documenis Version 1.0 (XML-SSİ. 

e SVG includes a complete Document Obiect Model (DOM) and conforms to the Document Obfect Model 
(DOM) Level 1 Recommendation İDOM1l. The SVG DOM has a high level of compatibility and consisteney 
vvith the HTML DOM that is defined in the DOM Level 1 specification. Additionally, the SVG DOM supports 
and incorporates many of the facilities described in DOM Level 2, including the CSS obfect model and event 
handling IDOM2) IDOM32STYLE) (DOM?EVENTSİ. 

e SVG incorporates some features and approaches that are part of the Synchronized Multimedia Integration 
Language (SMIL) 3.0 Specification İSMTL), including the “svvitch” element and the “systemLanguage” attribute. 

e SVGs animation features (see Animation) vvere developed in collaboration vvith the VV3C Synchronized Mul- 
timedia (SYMM) VVorking Group, developers of the Syncehronized Multimedia Integration Language (SMIL) 
3.0 Specification İSMTLİ. SVG"s animation features incorporate and extend the general-purpose XML anima- 
tion capabilities described in the SMIL Animation specification (SMILANIM)I. 

e SVG has been designed to allovv SMİL to use animated or static SVG content as media components. 

e SVG attempis to achieve maximum compatibility vvith both HTML 4 İfHTMLAİ and XHTMLTM 1.0 (XHTMLI. 
Many of SVG s facilities are modeled directly after HTML, including its use of CSS TCSS2), its approach to 
event handling, and its approach to its Document Obiect Model İDOM2). 

e SVG is compatible vvith VV3C vvork on internationalization. References (VV3C and othervvise) include: 
TUNICODEİ and İCHARMODİ. Also, see Internationalization Support. 

e SVG is compatible vvith VV3C vvork on VVeb Accessibility. Also, see Accessibility Support. 


m environments vvhich support DOM 2 Core TDOM2) for other XML grammars (e.g., XHTML İXHTMLİ) and 
vvhich also support SVG and the SVG DOM, a single scripting approach can be used simultaneously for both XML 
documents and SVG graphics, in vvhich case interactive and dynamic effects vvill be possible on multiple XML 
namespaces using the same set of scripts. 


1.5 Terminology 


VVithin this specification, the key vvords "MUST", "MUST NOT", "REQUIRED", "SHALL", "SHALL NOT", 
"SHOULD", "SHOULD NOT", "RECOMMENDED", "MAY", and "OPTIONALT" are to be interpreted as described in 
Key vvords for use in RFCs to Indicate Requirement Levels İRFC21191. Hovvever, for readability, these vvords do not 
appear in all uppercase letters in this specification. 

At times, this specification recommends good practice for authors and user agents. These recommendations 
are not normative and conformance vvith this specification does not depend on their realization. These recom- 
mendations contain the expression "VVe recommend ..", "This specification recommends ..", or some similar vvord- 
ing. 
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1.6 Definitions 


animation element - An animation element is an element that can be used to animate the attribute or property 
value of another element. The follovving elements are animation elements: “animateColor”, “animateMotion”, “anim- 


ateTransform?, “animate” and “set”. 


animation event attribute - An animation event attribute is an event attribute that specifies script to run for a 
particular animation-related event. See Animation event attributes. The animation event attributes are “onbegin”, 


“onend”, “onload” and “onrepeat”. 


basic shape - Standard shapes vvhich are predefined in SVG as a convenience for common graphical operations. 
Specifically: “circle”, “ellipse”, “line”, “polygon”, “polyline” and “rect”. 


canvas - A surface onto vvhich graphics elements are dravvn, vvhich can be real physical media such as a display or 
paper or an abstract surface such as a allocated region of computer memory. See the discussion of the SVG canvas 
in the chapter on Coordinate Systems, Transformations and Units. 


elipping path - A combination of “path”, “text” and basic shapes vvhich serve as the outline of a (in the absence 
of anti-aliasing) 1-bit mask, vvhere everything on the "inside" of the outline is allovved to shovv through but 
everything on the outside is masked out. See Clipping paths. 


container element - An element vvhich can have graphics elements and other container elements as child ele- 


R əs 


ments. Specifically: “a”, “defs”, “giyph”, “g”, “marker”, “mask”, “missing-glyph”, “pattern”, “svg”, “svvitch” and “symbol”. 


conditional processing attribute - A conditional processing attribute is one that controls vvhether or not the ele- 
ment on vvhich it appears is processed. Most elements, but not all, may have conditional processing attributes 
specifled on them. See Conditional processing for details. The conditional processing attributes defined in SVG 1.1 


are “requiredExtensions”, “requiredFeatures” and “systemLanguage”. 


core attributes - The core attributes are those attributes that can be specifted on any SVG element. See Common 
attributes. The core attributes are “id”, “xml:base”, “xml:lang” and “xml:space”. 


current innermost SVG document fragment - The XML document sub-tree vvhich starts vvith the most immedi- 
ate ancestor “svg” element of a given SVG element. 


current SVG document fragment - The XML document sub:tree vvhich starts vvith the outermost ancestor “svg” 
element of a given SVG element, vvith the requirement that all container elements betvveen the outermost “svg” 
and this element are all elements in the SVG language. 


current transformation matrix (CTM) - Transformation matrices define the mathematical mapping from one 
coordinate system into another using a 3x3 matrix using the equation İx" y" 1) - Ixy 1) ” matrix. The current trans- 
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formation matrix (CTM) defines the mapping from the user coordinate system into the vievvport coordinate sys- 
tem. See Coordinate system transformations. 


descriptive element - An element vvhich provides supplementary descriptive information about its parent. Spe- 
cifically, the follovving elements are descriptive elements: “desc”, “metadata” and “title”. 


document event attribute - A document event attribute is an event attribute that specifies script to run for a par- 
ticular document-vvide event. See Document-level event attributes. The document event attributes are “onabort”, 


“onerror”, “onresize”, “onscroll”, “onunload” and “onzoom”. 


event attribute - An event attribute is one that specifies some script to run vvhen an event of a certain type is 
dispatched to the element on vvhich the attribute is specifted. See Event attributes. 


fill - The operation of painting the interior of a shape or the interior of the character giyphs in a text string. 


filter primitive attributes - The filter primitive attributes is the set of attributes that are common to all filter prim- 
itive elements. They are “height”, “result”, “vridth”, “x” and “y”. 


filter primitive element :. A filter primitive element is one that can be used as a child of a “filter” element 
to specify a node in the filter graph. The follovving elements are the filter primitive elements defined in SVG 
1.1: “feBlend”, “feColorMatrix”, “feComponentTransfer”, “feComposite”, “feConvolveMatrix”, “feDiffuseLighting, TfeDis- 
placementMap”, “fTeFlood”, “feGaussianBlur”, “felmage”, “feMerge”, “feMorphology”, “feOffset”, “feSpecularLighting”, 
“feTile” and “feTurbulence”. 


font - A font represents an organized collection of glyphs in vvhich the various gİyph representations vvill share 
a common İook or styling such that, vvhen a string of characters is rendered together, the result is highly legible, 
conveys a particular artistic style and provides consistent inter-character alignment and spacing. 


giyph : A giyph represents a unit of rendered content vvithin a font. Often, there is a one-to-one correspondence 
betvveen characters to be dravvn and corresponding glyphs (e.g., often, the character "A" is rendered using a single 
giyph), but other times multiple gilyphs are used to render a single character (e.g., use of accents) or a single glyph 
can be used to render mulltiple characters (e.g., ligatures). Typically, a giyph is defined by one or more shapes such 
as a path, possibly vvith additional information such as rendering hints that help a font engine to produce legible 
text in small sizes. 


gradient element - A gradient element is one that defines a gradient paint server. SVG 1.1 defines the follovving 
gradient elements: “linearGradient” and “radialGradient”. 


graphical event attribute - A graphical event attribute is an event attribute that speciftes seript to run for a par- 
ticular user interaction event. See Event attributes on graphics and container elements. The graphical event at- 
tributes are “onactivate”, “onclick”, “onfocusin”, “onfocusout”, “onload”, “onmousedovvn”, “onmousemove”, “onmouseout”, 


“onmouseover” and “onmouseup”. 
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graphics element - One of the element types that can cause graphics to be dravvn onto the target canvas. Specific- 


ally: “circle”, “ellipse”, “image”, “ine”, “path”, “polygon”, “polyline”, “rect”, “text” and “use”. 


graphics referencing element - A graphics element vvhich uses a reference to a different document or element as 
the source of its graphical content. Specifically: “image” and “use”. 


hit-testing : The process of determining vvhether a pointer intersects a given graphics element. Hit-testing is used 
in determining vvhich element to dispatch a mouse event to, vvhich might be done in response to the user moving 
the pointing device, or by changes in the position, shape and other attributes of elements in the document. Hit- 
testing is also knovvn as hif defection or picking. See hit-testing and processing order for user interface events and 
the definition of the “pointer-events” property. 


IRI reference - An IRİ reference is an Internationalized Resource Identifter vvith an optional fragment identifter, 
as defined in İnternationalized Resource Identifiers İRFC39871. An TRİ reference serves as a reference to a resource 
or (vvith a fragment identifter) to a secondary resource. See References and the “defs” element. 


light source element - A light source element is one that can specify light source information for an “feDif- 
fuseLighting” or “feSpecularLighting” element. The follovving light source elements are defined in SVG 1.1: 
“TeDistantLight”, “fePointLight” and “feSpotLight”. 


local TRİ reference - An Internationalized Resource Identifter İRFC3987İ that does not include an -absolutelRI5 or 
erelativelRI- and thus represents a reference to an element vvithin the current document. See References and the 


“defs” element. 


mask - A container element vvhich can contain graphics elements or other container elements vvhich define a set 
of graphics that is to be used as a semi-transparent mask for compositing foreground obiects into the current back- 
ground. See Masks. 


non-local IRI reference - An Internationalized Resource Identifter İRFC3987) that includes an -absolutelRI5 or 
erelativelRI- and thus (usually) represents a reference to a different document or an element vvithin a different 
document. See References and the “defs” element. 


outermost svg element : The furthest “svg” ancestor element that remains in the current SVG document fragment. 


paint - A paint represents a vvay of putting color values onto the canvas. A paint might consist of both color values 
and associated alpha values vvhich control the blending of colors against already existing color values on the can- 
vas. SVG supports three types of built-in paint: color, gradients and patterns. 


presentation attribute - An XML attribute on an SVG element vvhich specifies a value for a given property for 
that element. See Styling. Note that although any property may be specif?ed on any element, not all properties vvill 
appiy to (affect the rendering of) a given element. The definition of each property states to vvhat set of elements it 
applies. 
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property : A parameter that helps specify hovv a document should be rendered. A complete list of SVG"s properties 
can be found in Property Index. Properties are assigned to elements in the SVG language either by presentation 
attributes on elements in the SVG language or by using a styling language such as CSS TCSS2). See Styling. 


rootmost “svg” element - The rootmost “svg” element is the furthest “svg” ancestor element that does not exit an 
SVG context. See also SVG document fragment. 


shape - A graphics element that is defined by some combination of straight lines and curves. Specifically: “path”, 


“rect”, “circle”, “ellipse”, Tine”, “polyline” and “polygon”. 
stroke - The operation of painting the outline of a shape or the outline of character glyphs in a text string. 


structural element - The structural elements are those vvhich define the primary structure of an SVG document. 


daş 


Specifically, the follovving elements are structural elements: “defs”, “g”, “svg/, “symbol” and “use”. 


SVG canvas - The canvas onto vvhich the SVG content is rendered. See the discussion of the SVG canvas in the 
chapter on Coordinate Systems, Transformations and Units. 


SVG context - An SVG context is a document fragment vvhere all elements vvithin the fragment must be sub/ect 
to processing by an SVG user agent according to the rules in this specification. 

IF SVG content is embedded inline vvithin parent XML (such as XHTML), the SVG context does not include 
the ancestors above the rootmost “svg” element. If the SVG content contains any “foreignObiect” elements vvhich in 
turn contain non-SVG content, the SVG context does not include the contents of the “foreignObiect” elements. 


SVG document fragment - The XML document sub-tree vvhich starts vvith an “svg” element. An SVG document 
fragment can consist of a stand-alone SVG document, or a fragment of a parent XML document enclosed by an 
“svg” element. VVhen an “svg” element is a descendant of another “svg” element, there are tvvo SVG document frag- 
ments, one for each “svg” element. (One SVG document fragment is contained vvithin another SVG document frag- 


ment.) 
SVG user agent - An SVG user agent is a user agent that is able to retrieve and render SVG content. 


SVG vievvport - The vievvport vvithin the SVG canvas vvhich defines the rectangular region into vvhich SVG content 
is rendered. See the discussion of the SVG vievvport in the chapter on Coordinate Systems, Transformations and 
Units. 


text content element - A text content element is an SVG element that causes a text string to be rendered onto the 
canvas. The SVG 1.1 text content elements are the follovving: “altGlyph”, “textPath”, “text”, “tref” and “tspan” 


text content child element : A text content child element is a text content element that is allovved as a descendant 
of another text content element. In SVG 1.1, the text content child elements are the follovving: “aliGlyph”, “textPath”, 
“tref” and “tspan” 
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text content block element - A text content block element is a text content element that serves as a standalone 
element for a unit of text, and vvhich may optionally contain certain child text content elements (e.g. “tspan”). . 


transformation - A modification of the current transformation matrix (CTM) by providing a supplemental trans- 
formation in the form of a set of simple transformations specifications (such as scaling, rotation or translation) 
and/or one or more transformation matrices. See Coordinate system transformations. 


transformation matrix - Transformation matrices define the mathematical mapping from one coordinate system 
into another using a 3x3 matrix using the equation fx" y" 1) - Ix y 11 “ matrix. See current transformation matrix 
(CTM) and Coordinate system transformations. 


user agent : The general definition of a user agent is an application that retrieves and renders VVeb content, in- 
cluding text, graphics, sounds, video, images, and other content types. A user agent may require additional user 
agents that handle some types of content. For instance, a brovvser may run a separate program or plug-in to 
render sound or video. User agents include graphical desktop brovvsers, multimedia players, text brovvsers, voice 
brovvsers, and assistive technologies such as screen readers, screen magnifters, speech synthesizers, onscreen key- 
boards, and voice input softvvare. 

A "user agent" may or may not have the ability to retrieve and render SVG content: hovvever, an "SVG user 
agent" retrieves and renders SVG content. 


user coordinate system - İn general, a coordinate system defines locations and distances on the current canvas. 
"The current user coordinate system is the coordinate system that is currently active and vvhich is used to define 
hovv coordinates and lengths are located and computed, respectively, on the current canvas. See initial user co- 
ordinate system and Coordinate system transformations. 


user space - A synonym for user coordinate system. 


user units - A coordinate value or length expressed in user units represents a coordinate value or length in the 
current user coordinate system. Thus, 10 user units represents a length of 10 units in the current user coordinate 
system. 


vievvport - A rectangular region vvithin the current canvas onto vvhich graphics elements are to be rendered. See 
the discussion of the SVG vievvport in the chapter on Coordinate Systems, Transformations and Units. 


vievvport coordinate system - In general, a coordinate system defines İocations and distances on the current can- 
vas. The vievrport coordinate system is the coordinate system that is active at the start of processing of an “svg” 
element, before processing the optional “vievvBox” attribute. In the case of an SVG document fragment that is em- 
bedded vvithin a parent document vvhich uses CSS to manage its layout, then the vievvport coordinate system vvill 
have the same orientation and lengths as in CSS, vvith the origin at the top-left on the vievvport. See The initial 
vievvport and Establishing a nevv vievvport. 


vievvport space - A synonym for vievvport coordinate system. 
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vievvport units - A coordinate value or length expressed in vievvport units represents a coordinate value or length 
in the vievvport coordinate system. Thus, 10 vievvport units represents a length of 10 units in the vievvport coordin- 


ate system. 


XLink attributes - The XLink attributes are the seven attributes defined in the XML Linking Language specific- 
ation FXLINK), vvhich are used on various SVG elements that can reference resources. The most import XLink 
attribute is “xlink:href”, vvhose definition can be found on each element that allovvs it. The remaining XLink attrib- 
utes are “xlink:type”, “xlink-role”, “xlink:arcrole”, “xlink:title”, “xlink:shovv” and “xlink-actuate”. 
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2 Concepts 


Contents 


2.1 Explaining the name: SVG 
2.2 İmportant SVG concepts 
2.3 Options for using SVG in VVeb pages 


2.1 Explaining the name: SVG 
SVG stands for Scalable Vector Graphics, an XML grammar for stylable graphics, usable as an XML namespace. 


Scalable 


To be scalable means to increase or decrease uniformly. In terms of graphics, scalable means not being limited to 
a single, fixed, pixel size. On the VVeb, scalable means that a particular technology can grovv to a large number 
of files, a large number of users, a vvide variety of applications. SVG, being a graphics technology for the VVeb, is 
scalable in both senses of the vvord. 

SVG graphics are scalable to different display resolutions, so that for example printed output uses the full 
resolution of the printer and can be displayed at the same size on screens of different resolutions. The same SVG 
graphic can be placed at different sizes on the same VVeb page, and re-used at different sizes on different pages. 
SVG graphics can be magnifited to see fine detail, or to aid those vvith lovv vision. 

SVG graphics are scalable because the same SVG content can be a stand-alone graphic or can be referenced 
or included inside other SVG graphics, thereby allovving a complex illustration to be built up in parts, perhaps by 
several people. "The symbol, marker and font capabilities promote re-use of graphical components, maximize the 
advantages of HTTP caching and avoid the need for a centralized registry of approved symbols. 


Vector 


Vector graphics contain geometric obfects such as lines and curves. This gives greater flexibility compared to 
raster-only formats (such as PNG and /PEG) vvhich have to store information for every pixel of the graphic. Typ- 
ically, vector formats can also integrate raster images and can combine them vvith vector information such as clip- 
ping paths to produce a complete illustration, SVG is no exception. 

Since all modern displays are raster-oriented, the difference betvveen raster-only and vector graphics comes 
dovvn to vvhere they are rasterized: client side in the case of vector graphics, as opposed to already rasterized on 
the server. SVG gives control over the rasterization process, for example to allovv anti-aliased artvvork vvithout the 
ugly aliasing typical of lovr quality vector implementations. SVG also provides client-side raster filter effects, so 
that moving to a vector format does not mean the loss of popular effects such as soft drop shadovvs. 
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Graphics 


Most existing XML grammars represent either textual information, or represent ravv data such as financial in- 
formation. They typically provide only rudimentary graphical capabilities, often less capable than the HTML "img" 
element. SVG fills a gap in the market by providing a rich, structured description of vector and mixed vector/raster 
graphics: it can be used stand-alone, or as an XML namespace vvith other grammars. 


XML 


XML, a for structured information exchange, has become extremely popular and is both vvidely and reliably im- 
plemented. By being vvritten in XML, SVG builds on this strong foundation and gains many advantages such as a 
sound basis for internationalization, povverful structuring capability, an obiect model, and so on. By building on 
existing, cleanly-implemented specifications, XML-based grammars are open to implementation vvithout a huge 
reverse engineering effort. 


Namespace 


İt is certainly useful to have a stand-alone, SVG-only vievver. But SVG is also intended to be used as one component 
in a multi-namespace XML application. This multiplies the povver of each of the namespaces used, to allovv in- 
novative nevv content to be created. For example, SVG graphics may be included in a document vvhich uses any 
text-oriented XML namespace - including XHTML. A scientific document, for example, might also use MathML 
for mathematics in the document. The combination of SVG and SMIL leads to interesting, time based, graphically 
rich presentations. 

SVG is a good, general-purpose component for any multi-namespace grammar that needs to use graphics. 


Stylable 


"The advantages of style sheets in terms of presentational control, flexibility, faster dovvnload and improved main- 
tenance are novv generally accepted, certainly for use vvith text. SVG extends this control to the realm of graphics. 

The combination of seripting, DOM and CSS is often termed "Dynamic HTML" and is vvidely used for an- 
imation, interactivity and presentational effects. SVG allovvs the same seript-based manipulation of the document 
tree and the style sheet. 


2.2 lmportant SVC concepts 


Graphical Obiects 


VVith any XML grammar, consideration has to be given to vvhat exactly is being modelled. For textual formats, 
modelling is typically at the level of paragraphs and phrases, rather than individual nouns, adverbs, or phonemes. 
Similarly, SVG models graphics at the level of graphical obyects rather than individual points. 

SVG provides a general path element, vvhich can be used to create a huge variety of graphical obiects, and 
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also provides common basic shapes such as rectangles and ellipses. These are convenient for hand coding and may 
be used in the same vvays as the more general path element. SVG provides fine control over the coordinate system 
in vrhich graphical obfects are defined and the transformations that vvill be applied during rendering. 


Symbols 


It vvould have been possible to define some standard symbols that SVG vvould provide. But vvhich ones? There 
vvould alvvays be additional symbols for electronics, cartography, flovvcharts, etc., that people vvould need that 
vvere not provided until the "next version". SVG allovvs users to create, re-use and share their ovvn symbols vvithout 
requiring a centralized registry. Communities of users can create and refine the symbols that they need, vvithout 
having to ask a committee. Designers can be sure exactly of the graphical appearance of the symbols they use and 
not have to vvorry about unsupported symbols. 

Symbols may be used at different sizes and orientations, and can be restyled to fit in vvith the rest of the 
graphical composition. 


Raster Effects 


Many existing VVeb graphics use the filtering operations found in paint packages to create blurs, shadovvs, lighting 
effects and so on. VVith the client-side rasterization used vvith vector formats, such effects might be thought im- 
possible. SVG allovvs the declarative specification of filters, either singly or in combination, vvhich can be applied 
on the client side vvhen the SVG is rendered. These are specifted in such a vvay that the graphics are still scalable 
and displayable at different resolutions. 


Fonts 


Graphically rich material is often highly dependent on the particular font used and the exact spacing of the glyphs. 
In many cases, designers convert text to outlines to avoid any font substitution problems. This means that the 
original text is not present and thus searchability and accessibility suffer. In response to feedback from designers, 
SVG includes font elements so that both text and graphical appearance are preserved. 


Animation 


Animation can be produced via secript-based manipulation of the document, but scripts are difficult to edit and 
interchange betvveen authoring tools is harder. Again in response to feedback from the design community, SVG 
includes declarative animation elements vvhich vvere designed collaboratively by the SVG and SYMM VvVorking 
Groups. This allovvs the animated effects common in existing VVeb graphics to be expressed in SVG. 


2.3 Options for using SVG in VVeb pages 


"There are a variety of vvays in vvhich SVG content can be included vvithin a VVeb page. Here are some of the op- 
tions: 
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A stand-alone SVG VVeb page 
Im this case, an SVG document (i.e., a VVeb resource vvhose MIME type is "image/svgixml") is loaded direetly 
into a user agent such as a VVeb brovvser. The SVG document is the VVeb page that is presented to the user. 
Embedding by reference 
In this case, a parent VVeb page references a separately stored SVG document and speciftes that the given 
SVG document should be embedded as a component of the parent VVeb page. For HTML or XHTML, here 
are three options: 


ə The HTML/XHTML “img” element is the most common method for using graphics in HTML pages. 
For faster display, the vvidth and height of the image can be given as attributes. One attribute that is 
required is “alt”, used to give an alternate textual string for people brovvsing vvith images off, or vvho 
cannot see the images. The string cannot contain any markup. A “longdesc” attribute lets you point to a 
longer description - often in HTML - vvhich can have markup and richer formatting. 

e The HTML/XHTML “obiect” element can contain other elements nested vvithin it, unlike “img,, vvhich is 
empty. This means that several different formats can be offered, using nested “obiect” elements, vvith a 
final textual alternative (including markup, links, etc). The outermost element vvhich can be displayed 
vvill be used. 

ə The HTML/XHTML “applet” element vvhich can invoke a lava applet to vievv SVG content vvithin the 
given VVeb page. These applets can do many things, but a common task is to use them to display images, 
particularly ones in unusual formats or vvhich need to be presented under the control of a program for 


some other reason. 


Embedding inline 
In this case, SVG content is embedded inline directly vvithin the parent VVeb page. An example is an XHTML 
VVeb page vvith an SVG document fragment textually included vvithin the XHTML. 

External link, using the HTML “a” element 
"This allovvs any stand-alone SVG vievver to be used, vvhich can (but need not) be a different program to that 
used to display HTML. This option typically is used for unusual image formats. 

Referenced from a CSS or XSL property 
VVhen a user agent supports CSS-styled XML content TCSS2) or XSL IXSLİ and the user agent is a Conform- 
ing SVG Vievver, then that user agent must support the ability to reference SVG resources vvherever CSS or 
XSL properties allovv for the referencing of raster images, including the ability to tile SVG graphics vvherever 
necessary and the ability to composite the SVG into the background if it has transparent portions. Examples 
include the “background-image” and “list-style-image” properties (TCSS2l, sections 14.2.1 and 12.6.2) that are 
included in both CSS and XSL. 
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3 Rendering Model 


Contents 


3.1 mtroduction 

3.2 The painters model 

3.3 Rendering Order 

3.4 Hovv groups are rendered 

3.5 Hovv elements are rendered 

3.6 Types of graphics elements 
3.6.1 Painting shapes and text 
3.6.2 Painting raster images 

3.7 Filtering painted regions 

3.8 Clipping, masking and obiect opacity 

3.9 Parent Compositing 


3.1 İntroduction 


Implementations of SVG are expected to behave as though they implement a rendering (or imaging) model cor- 
responding to the one described in this chapter. A real implementation is not required to implement the model in 
this vvay, but the result on any device supported by the implementation shall match that described by this model, 

The appendix on conformance requirements describes the extent to vvhich an actual implementation may de- 
viate from this description. İn practice an actual implementation vvill deviate slightly because of limitations of the 
output device (e.g. only a limited range of colors might be supported) and because of practical limitations in im- 
plementing a precise mathematical model (e.g. for realistic performance curves are approximated by straight lines, 
the approximation need only be sufficiently precise to match the conformance requirements). 


3.2 The painters model 


SVG uses a "painters model" of rendering. Paint is applied in successive operations to the output device such that 
each operation paints over some area of the output device. VVhen the area overlaps a previously painted area the 
nevv paint partially or completely obscures the old. VVhen the paint is not completely opaque the result on the 
output device is defined by the (mathematical) rules for compositing described under Alpha Blending. 


3.3 Rendering Order 


Elements in an SVG document fragment have an implicit dravving order, vvith the first elements in the SVG docu- 
ment fragment getting "painted" first. Subsequent elements are painted on top of previously painted elements. 
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3.4 Hovv groups are rendered 


Grouping elements such as the “g” element (see container elements) have the effect of producing a temporary sep- 
arate canvas initialized to transparent black onto vvhich child elements are painted. Upon the completion of the 
group, any filter effects specified for the group are applied to create a modified temporary canvas. "The modifted 
temporary canvas is composited into the background, taking into account any group-level masking and opacity 
settings on the group. 


3.5 Hovv elements are rendered 


Individual graphics elements are rendered as if each graphics element represented its ovvn group: thus, the effect 
is as if a temporary separate canvas is created for each graphics element. The element is first painted onto the 
temporary canvas (see Painting shapes and text and Painting raster images belovv). Then any filter effects specifted 
for the graphics element are applied to create a modified temporary canvas. The modifled temporary canvas is 
then composited into the background, taking into account any clipping, masking and obfect opacity settings on 
the graphics element. 


3.6 Types of graphics elements 
SVG supports three fundamental types of graphics elements that can be rendered onto the canvas: 


e Shapes, vvhich represent some combination of straight line and curves 

e "Text, vvhich represents some combination of character glyphs 

e Raster images, vvhich represent an array of values that specify the paint color and opacity (often termed al- 
pha) at a series of points on a rectangular grid. (SVG requires support for specifted raster image formats under 
conformance requirements.) 


3.6.1 Painting shapes and text 


Shapes and text can be filled (i.e., apply paint to the interior of the shape) and stroked (i.e., apply paint along the 
outline of the shape). A stroke operation is centered on the outline of the obiect, thus, in effect, half of the paint 
falİs on the interior of the shape and half of the paint falls outside of the shape. 

For certain types of shapes, marker symbols (vvhich themselves can consist of any combination of shapes, 
text and images) can be dravvn at selected vertices. Each marker symbaol is painted as if its graphical content vvere 
expanded into the SVG document tree fust after the shape obfect vvhich is using the given marker symbol. The 
graphical contents of a marker symbol are rendered using the same methods as graphics elements. Marker sym- 
bols are not applicable to text. 

The fill is painted first, then the stroke, and then the marker symbols. The marker symbols are rendered in 
order along the outline of the shape, from the start of the shape to the end of the shape. 
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Each fill and stroke operation has its ovvn opacity settings: thus, you can fill and/or stroke a shape vvith a 
semi-transparently dravvn solid color, vvith different opacity values for the fill and stroke operations. 

The fill and stroke operations are entirely independent painting operations: thus, if you both fill and stroke a 
shape, half of the stroke vvill be painted on top of part of the fill, 

SVG supports the follovving built-in types of paint vvhich can be used in fill and stroke operations: 


e Solid color 
e Gradients (linear and radial) 
e Patterns 


3.6.2 Painting raster images 


VVhen a raster image is rendered, the original samples are "resampled" using standard algorithms to produce 
samples at the positions required on the output device. Resampling requirements are discussed under conformance 
requirements. 


3.7 Filtering painted regions 


SVG allovvs any painting operation to be filtered. (See Filter Effects.) 

In this case the result must be as though the paint operations had been applied to an intermediate canvas ini- 
tialized to transparent black, of a size determined by the rules given in Filter Effects then filtered by the processes 
defined in Filter Effects. 


3.8 Clipping, masking and obiect opacity 


SVG allovvs any painting operation to be limited to a subregion of the output device by clipping and masking. This 
is described in Clipping, Masking and Compositing. 

Clipping uses a path to define a region of the output device to vvhich paint can be applied. Any painting op- 
eration executed vvithin the scope of the clipping must be rendered such that only those parts of the device that 
fall vvithin the clipping region are affected by the painting operation. A clipping path can be thought of as a mask 
vvherein those pixels outside the clipping path are black vvith an alpha value of zero and those pixels inside the 
clipping path are vvhite vvith an alpha value of one. "VVithin" is defined by the same rules used to determine the 
interior of a path for painting. The clipping path is typically anti-aliased on lovv-resolution devices (see “shape-ren- 
dering”. Clipping is described in Clipping paths. 

Masking uses the luminance of the color channels and alpha channel in a referenced SVG element to define a 
supplemental set of alpha values vvhich are multiplied to the alpha values already present in the graphics to vvhich 
the mask is applied. Masking is described in Masking. 

A supplemental masking operation may also be specifted by applying a "global" opacity to a set of rendering 
operations. In this case the mask is infinite, vvith a color of vvhite and an alpha channel of the given opacity value. 
(See the “opacity” property.) 

Im all cases the SVG implementation must behave as though all painting and filtering is first performed to 
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an intermediate canvas vvhich has been initialized to transparent black. Then, alpha values on the intermediate 
canvas are multiplied by the implicit alpha values from the clipping path, the alpha values from the mask, and 
the alpha values from the “opacity” property. The resulting canvas is composited into the background using simple 
alpha blending. Thus if an area of the output device is painted vvith a group opacity of 5077 using opaque red paint 
follovved by opaque green paint the result is as though it had been painted vvith fust 507, opaque green paint. This 
is because the opaque green paint completely obscures the red paint on the intermediate canvas before the inter- 
mediate as a vvhole is rendered onto the output device. 


3.9 Parent Compositing 


SVG document fragments can be semi-opaque. In many environments (e.g., VVeb brovvsers), the SVG document 
fragment has a final compositing step vvhere the document as a vvhole is blended translucently into the background 


canvas. 


5 Document Structure 


Contents 
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5.1 Defining an SVG document fragment: the “svg” element 
5.1.1 Overvievv 
5.1.2 The “svg” element 
5.2 Grouping: the “g” element 
5.2.1 Overvievv 
5.2.2 The “g” element 
5.3 Defining content for reuse, and the “defs” element 





5.3.1 Overvievv 
5.3.2 The “defs” element 
5.4 The “desc” and “title” elements 
5.5 The “symbol” element 
5.6 The “use” element 
5.7 The “image” element 
5.8 Conditional processing 
5.8.1 Conditional processing overvievv 
5.8.2 The “svvitch” element 
5.8.3 The “requiredFeatures” attribute 
5.8.4 The “requiredExtensions” attribute 
5.8.5 The “systemLanguage” attribute 
5.8.6 Applicability of test attributes 
5.9 Specifying vrhether external resources are required for proper rendering 
5.10 Common attributes 
5.10.1 Attributes common to all elements: “id” and “xml:base” 
5.10.2 The “xml:lang” and “xml:space” attributes 
5.11 DOM interfaces 
5.11.1 Interface SVGDocument 
5.11.2 mterface SVGSVGElement 
5.11.3 mterface SVGGElement 
5.11.4 mnterface SVGDefsElement 
5.11.5 Interface SVGDescElement 
5.11.6 Interface SVGTitleElement 
5.11.7 Interface SVGSymbolElement 
5.11.8 mterface SVGUseElement 
5.11.9 mterface SVGElementlinstance 
5.11.10 Interface SVGElementinstancelist 
5.11.11 Interface SVGlmageElement 
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5.11.12 Interface SVGSvvitchElement 
5.11.13 Interface GetSVGDocument 


5.1 Defining an SVG document fragment: the “svg” element 


5.1.1 Overvievv 


An SVG document fragment consists of any number of SVG elements contained vvithin an “svg” element. 

An SVG document fragment can range from an empty fragment (i.e., no content inside of the “svg” element), 
to a very simple SVG document fragment containing a single SVG graphics element such as a “rect”, to a complex, 
deeply nested collection of container elements and graphics elements. 

An SVG document fragment can stand by itself as a self-contained file or resource, in vvhich case the SVG 
document fragment is an SVG document, or it can be embedded inline as a fragment vvithin a parent XML docu- 
ment. 

The follovving example shovvs simple SVG content embedded inline as a fragment vvithin a parent XML 
document. Note the use of XML namespaces to indicate that the “svg” and “ellipse” elements belong to the SVG 
namespace: 


c?xml version-"1.0" standalonez"yes"?s5 
cparent xmlnse"http://example.org" 
xmlns:svge"http: / /vMM/..V3.org/2000/svg"s 
xc1-- parent contents here --x 
€SVg:svg vidth-"4cm" height-"8cm" versionz"1.1"5 
€svg:ellipse cxze"2cm" cye"4cm" rxze"2cm" rye"l1cm" /5 
x€/ sVg:svgr 
e1-- 2.2. --- 
c/ parent” 


"This example shovvs a slightly more complex (i.e., it contains multiple rectangles) stand-alone, self-contained SVG 
document: 


c?xml versionz"1.0" standalonez"no"?s 
€ DOCTYPE svg PUBLİC "-//03C//DTD SVG 1.1//EN" 
"http: / /u/v .v3.org/Graphics/SVG/1.1/DTD/svg11.dtd"x 
s€svg vidth-"5cm" height-"4cm" version-"1.1" 
xmlnse"http: / /uvv .vV3.0T9/2000/svg"” 
edescəsFour separate rectangles 
x/descə 
crect xe"0.5cm" yz"0.5cm" vidth-"2cm" heighte"1cm"/” 
crect xe"0.5cm" y-"2cm" vidth-"1cm" height-"1.5cm"/5 
crect xe"3cm" y-"0.5cm" vidth-"1.5cm" height-"2cm"/x 
crect xe"3.5cm" y-"3cm" vidth-"l1cm" height-"0.5cm"/5 


c1-- Shov outline of canvas using "rect" element --5 
crect xe".0lcm" y-".0lcm" vidth-"4.98cm" height-"3.98cm" 
fill-"none" strokez"blue" stroke-vidthe".02cm" /5 


x/ svg” 


“svg” elements can appear in the middle of SVG content. This is the mechanism by vvhich SVG document fragments 
can be embedded vvithin other SVG document fragments. 

Another use for “svg/ elements vvithin the middle of SVG content is to establish a nevv vievvport. (See Estab- 
lishing a nevv vievvport.) 

In all cases, for compliance vvith the Namespaces in XML Recommendation İXML-NSİ), an SVG namespace 
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declaration must be provided so that all SVG elements are identified as belonging to the SVG namespace. The fol- 
lovving are possible vvays to provide a namespace declaration. An “xmlİns” attribute vvithout a namespace prefix 
could be specifted on an “svg” element, vvhich means that SVG is the default namespace for all elements vvithin the 
scope of the element vvith the “xmİns” attribute: 


x€svg xmlnse"http://vvv/.v3.org/2000/svg" ..s 
xrect ../” 
x/ svg” 


If a namespace prefix is specifted on the “xmlns” attribute (e.g., xmlns :svge"http:/ /vvv/.v3.o0rg/2000/ vg"), 
then the corresponding namespace is not the default namespace, so an explicit namespace prefix must be assigned 
to the elements: 


€SVg:svg xmlns:svge"http: / /vvv .vV3.org/2000/svg" ...s 
€svg:rect ../s 
x/ SVg:SVg” 


Namespace prefixes can be specifted on ancestor elements (illustrated in the above example). For more informa- 
tion, refer to the Namespaces in XML Recommendation EXML-NSI. 


5.1.2 The “svg” element 


Categories: “svg” 
Container element, structural element 


Content model: 

Any number of the follovving elements, in any order: 
animation elements 
descriptive elements 
shape elements 
structural elements 
gradient elements 
. 

“altGiyphDef” 
“clipPath” 
“color-profile” 
“cursor” 

“filter” 

“font” 
“font-face” 
“ToreignObiect” 
“image” 
“marker” 


“mask” 


“pattern” 
“script” 
“style” 
“svvitch” 
“text” 


“vievv” 
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Attributes: 
conditional processing attributes 
core attributes 
document event attributes 
graphical event attributes 





presentation attributes 
“class” 

“style” 
“externalResourcesRequired” 


x 


dE 


z 

“vvidth” 

“height” 

“vievBox” 
“preserveAspectRatio” 
“zoomAndPan” 
“version” 

“baseProfile” 
“contentSeriptType” 
“contentStyleType” 


.. 


xXx 


er 


y 

“vvidth” 
“height” 
“version” 
“baseProfile” 


DOM Interfaces: 
SVGSVGElement 


Attribute definitions: 


version — "-number-" 


Imdicates the SVG language version to vvhich this document fragment conforms. 


m SVG 1.0 İSVG10), this attribute vvas fixed to the value "1.0". For SVG 1.1, the attribute should have the 
value "1.1". 
Animatable: no. 


baseProfile - profile-name 
Deseribes the minimum SVG language profile that the author believes is necessary to correctly render the 
content. The attribute does not specify any processing restrictions: It can be considered metadata. For ex- 
ample, the value of the attribute could be used by an authoring tool to vvarn the user vvhen they are modify- 
ing the document beyond the scope of the specified base profile. Each SVG profile should define the text that 
is appropriate for this attribute. 
If the attribute is not specifted, the effect is as if a value of "none" vvere specifted. 
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Animatable: no. 





x — "-coordinate-" 
(Has no meaning or effect on outermost svg elements.) 
"The x-axis coordinate of one corner of the rectangular region into vvhich an embedded “svg” element is 
placed. 
If the attribute is not specifted, the effect is as if a value of "0" vvere specifted. 
Animatable: yes. 


y — "-coordinates" 
(Has no meaning or effect on outermost svg elements.) 
"The y-axis coordinate of one corner of the rectangular region into vvhich an embedded “svg” element is 
placed. 
If the attribute is not specifted, the effect is as if a value of "0" vvere specifted. 


Animatable: yes. 


vidth - "-lengith-" 
For outermost svg elements, the intrinsic vvidth of the SVG document fragment. For embedded “svg” ele- 
ments, the vvidth of the rectangular region into vvhich the “svg” element is placed. 
A negative value is an error (see Error processing). A value of zero disables rendering of the element. 
If the attribute is not specifted, the effect is as if a value of "1007 vvere specifted. 


Animatable: yes. 


height — "-length-" 
For outermost svg elements, the intrinsic height of the SVG document fragment. For embedded “svg” ele- 
ments, the height of the rectangular region into vvhich the “svg” element is placed. 
A negative value is an error (see Error processing). A value of zero disables rendering of the element. 
If the attribute is not specifted, the effect is as if a value of "10077" vvere specifted. 
Animatable: yes. 


preserveAspectRatio — "İdeferl -align- T-meetOrsSlice-1" 
See “preserveAspectRatio”. 
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If the attribute is not specifted, then the effect is as if a value of "xMidYMid meet" vvere specifted. 
Animatable: yes. 


contentScriptType — "contfent-type" 
See "contentSeriptType". 


contentStyleType - "confent-type" 
See "contentStyleType". 


zoomAndPan z "disable İ magnify" 
See oomAndPan". 


If an SVG document is likely to be referenced as a component of another document, the author vvill often vvant to 
include a “viev/Box” attribute on the outermost svg element of the referenced document. This attribute provides a 
convenient vvay to design SVG documents to scale-to-fit into an arbitrary vievvport. 


5.2 Grouping: the “g” element 


5.2.1 Overvievv 


"The “g” element is a container element for grouping together related graphics elements. 

Grouping constructs, vvhen used in conğunction vvith the “desc” and “title” elements, provide information about 
document structure and semantics. Documents that are rich in structure may be rendered graphically, as speech, 
or as braille, and thus promote accessibility. 

A group of elements, as vvell as individual obiects, can be given a name using the “id” attribute. Named groups 
are needed for several purposes such as animation and re-usable obiects. 

An example: 


c?xml versionz"1.0" standalonez"no"?x 
x DOCTYPE svg PUBLİC "-//V/3C/ /DTD SVG 1.1//EN" 
"http: / /vvv/.vV3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
x€svg xmlnsze"http:/ /vvv/.v3.org/2000/svg" 
versionz"1.1" vidth-"5cm" height-"5cm"xs 
edescəoTuo groups, each of tvo rectangles-/desc- 
vg id-"group1" fill-"red"s 
crect xe"1cm" y-"lcm" vidth-"1cm" height-"1cm"/5 
crect xe"3cm" ye"lcm" vidth-"1cm" height-"1cm"/5 
x/g” 
c€g id-"group2" fill-"blue"- 
crect xe"1cm" y-"3cm" vidth-"1cm" height-"1cm"/5 
crect xe"3cm" y-"3cm" vidth-"1cm" height-"1cm"/5 
x/g” 


c1-- Shov outline of canvas using "rect" element --x 
crect x-".0lcm" y-".0lcm" vidth-"4.98cm" height-"4.98cm" 
fill-"none" strokez"blue" stroke-vidthe" .02cm"/” 
s/ svg” 


A “g” element can contain other “g” elements nested vvithin it, to an arbitrary depth. Thus, the follovving is possible: 


c?xml versionz"1.0" standalonez"no"?5 
€ DOCTYPE svg PUBLİC "-//V3C//DTD SVG 1.1//EN" 
"http: / /vuv/.vV3.org/Graphics/SVG/1.1/DTD/svg11.dtd"s 


xsvg xmlnsze"http://vvv/.v3.org/2000/svg" 
versionze"1.1" vidth-"4in" height-"3in"x 
edescəsGroups can neste/desc- 
eg 
eg 
cg” 
x/gz 
x/gz 
x/g” 
s/ svg” 
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Any element that is not contained vvithin a “g” is treated (at least conceptually) as if it vvere in its ovvn group. 


5.2.2 The “g” element 


Categories: 
Container element, structural element 





Content model: 

Any number of the follovving elements, in any order: 
animation elements 
descriptive elements 
shape elements 
structural elements 
gradient elements 
“a” 

“altGiyphDef” 

“clipPath” 

“color-profile” 

“cursor” 

“filter” 

“font” 

“font-face” 

“ToreignObiect” 

“image” 

“marker” 

“mask” 

“pattern” 

“script” 

“style” 

“svvitch” 

“text” 

“vievv” 
Attributes: 

conditional processing attributes 
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core attributes 

graphical event attributes 
presentation attributes 
“class” 

“style” 
“externalResourcesRequired” 


“transform” 


DOM Interfaces: 
SVGGElement 


5.3 Defining content for reuse, and the “defs” element 


5.3.1 Overvievv 


SVG allovvs graphical obfects to be defined for later reuse. To do this, it makes extensive use of IRI references 
İRFC3987) to these other obyects. For example, to fill a rectangle vvith a linear gradient, you first define a “lin- 
earGradient” element and give it an İD, as in: 


elinearGradient id-"MyGradient"s...c/linearGradient” 


You then reference the linear gradient as the value of the “fil” property for the rectangle, as in: 


crect stylee"fill:ur1(£MyGradient)"/” 


Some types of element, such as gradients, vvill not by themselves produce a graphical result. They can therefore 
be placed anyvvhere convenient. Hovvever, sometimes it is desired to define a graphical obiect and prevent it from 
being directly rendered. it is only there to be referenced elsevvhere. To do this, and to allovr convenient grouping 
defined content, SVG provides the “defs” element. 

It is recommended that, vvherever possible, referenced elements be defined inside of a “defs” element. Among 
the elements that are alvvays referenced: “altGiyphDef”, “clipPath”, “cursor”, “filter”, “inearGradient”, “marker”, “mask”, 
“pattern”, "radialGradient” and “symbol”. Defining these elements inside of a “defs” element promotes understandab- 
ility of the SVG content and thus promotes accessibility. 


5.3.2 The “defs” element 


Categories: “defs” 
Container element, structural element 


Content model: 
Any number of the follovving elements, in any order: 


animation elements 
descriptive elements 
shape elements 
structural elements 
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gradient elements 
.” 

“altGiyphDef” 
“clipPath” 
“color-profile” 
“cursor” 

“filter” 

“font” 


“font-face” 





“ToreignObiect” 

“image” 

“marker” 

“mask” 

“pattern” 

“script” 

“style” 

“svvitch” 

“text” 

“vievv” 

Attributes: 

conditional processing attributes 
core attributes 
graphical event attributes 
presentation attributes 
“class” 
“style” 
“externalResourcesRequired” 


“transform” 


DOM Tnterfaces: 
SVGDefsElement 


"The “defs” element is a container element for referenced elements. For understandability and accessibility reasons, 
it is recommended that, vvhenever possible, referenced elements be defined inside of a “defs”. 

The content model for “defs” is the same as for the “g” element: thus, any element that can be a child of a “g” 
can also be a child of a “defs”, and vice versa. 
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Elements that are descendants of a “defs” are not rendered directly: they are prevented from becoming part of 
the rendering tree fust as if the “defs” element vvere a “g” element and the “display” property vvere set to none. Note, 
hovvever, that the descendants of a “defs” are alvvays present in the source tree and thus can alvvays be referenced 
by other elements: thus, the value of the “display” property on the “defs” element or any of its descendants does not 
prevent those elements from being referenced by other elements. 

To provide some SVG user agents vvith an opportunity to implement efficient implementations in streaming 
environments, creators of SVG content are encouraged to place all elements vvhich are targets of local TRİ referen- 
ces vvithin a “defs” element vvhich is a direct child of one of the ancestors of the referencing element. For example: 


c?xml versionz"1.0" standalone-"no"?5 
€ DOCTYPE svg PUBLİC "-//03C//DTD SVG 1.1//EN" "http://vv.v3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
s€svg vidth-"8cm" height-"3cm" 
xmlnsze"http: / /vv/ .vV3.0T9/2000/svg" versionze"1.1"5 
edescoLocal URI references vithin ancestor"s "defs" element.-/desc” 
edefss 
elinearGradient id-"Gradient01"5 
€stop offsetz"205-" stop-colorz"39F" /5 
€stop offsetz"905-" stop-colorz"EF3F" /s 
e/linearGradient- 
e/defs- 
crect xe"1cm" y-"lcm" vidth-"6cm" height-"1cm" 
fill-"url(£Gradient01)" /s 
c1-- Shov outline of canvas using "rect" element --x 
crect x-".0lcm" y-".0lcm" vidth-"7.98cm" height-"2.98cm" 
fill-"none" strokez"blue" stroke-vidthez" .02cm" /5 


x/ svg” 


m the document above, the linear gradient is defined vvithin a “defs” element vvhich is the direct child of the “svg” 
element, vvhich in turn is an ancestor of the “rect” element vvhich references the linear gradient. Thus, the above 
document conforms to the guideline. 


5:4 The “desc” and “title” elements 


Categories: “desc” 
Descriptive element 


Content model: 
Any elements or character data. 


Attributes: 
core attributes 
“class” 


“style” 


DOM Interfaces: 
SVGDescElement 


Categories: “title” 
Descriptive element 


Content model: 
Any elements or character data. 
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Attributes: 
core attributes 
“class” 


“style” 


DOM Interfaces: 
SVGTitleElement 





Each container element or graphics element in an SVG dravving can supply a “desc” and/or a “title” description 
string vvhere the description is text-only. VVhen the current SVG document fragment is rendered as SVG on visual 
media, “desc” and “title” elements are not rendered as part of the graphics. User agents may, hovvever, for example, 
display the “title” element as a tooltip, as the pointing device moves over particular elements. Alternate present- 
ations are possible, both visual and aural, vvhich display the “desc” and “title” elements but do not display “path” 
elements or other graphics elements. "This is readily achieved by using a different (perhaps user) style sheet. For 
deep hierarchies, and for follovving “use” element references, it is sometimes desirable to allovv the user to control 
hovv deep they drill dovr into descriptive text. 

In conforming SVG document fragments, any “title” element should be the first child element of its parent. 
Note that those implementations that do use “title” to display a tooltip often vvill only do so if the “title” is indeed 
the first child element of its parent. 

The follovving is an example. In typical operation, the SVG user agent vvould not render the “desc” and “title” 


elements but vvould render the remaining contents of the “g” element. 


x?xml versionze"1.0" standalonez"no"?xs 
cIDOCTYPE svg SYSTEM "http:/ /uuv..v3.org/Graphics/SVG/1.1/DTD/svg11.dtd"- 
xsvg xmlnsze"http: / /vv/.vV3.orTg/2000/svg" 

versionze"1.1" vidth-"4in" height-"3in"- 


€g- 
etitlesCompany sales by regionce/titlec 
xdesc” 
This is a bar chart vhich shovs 
company sales by region. 
xs/desc” 
c1-- Bar chart defined as vector data --s 
x/gz 
c/ svg” 


Description and title elements can contain marked-up text from other namespaces. Here is an example: 


e?xml versione"1.0" standalonez"yes"?s 
xsvg xmlnsze"http: / /vvuv..vV3.org/2000/svg" 
versionze"1.1" vidth-"4in" height-"3in"- 
edesc xmlns:mydoce"http:// example .org/mydoc"z 
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emydoc:titlesThis is an example SVG filec/mydoc:titles 
emydoc:parasThe global description uses markup from the 
xemydoc : emphxmydoc-/mydoc : emphx namespace .-/mydoc :parax 
x/desc” 
€g- 
c1-- the picture goes here --x 
x/gz 
x/ svg” 


Authors should alvvays provide a “title” child element to the outermost svg element vvithin a stand-alone SVG doc- 
ument. The “title” child element to an “svg” element serves the purposes of identifying the content of the given 
SVG document fragment. Since users often consult documents out of context, authors should provide context-rich 
titles. Thus, instead of a title such as "Introduction", vvhich doesn"t provide much contextual background, authors 
should supply a title such as "Introduction to Medieval Bee-Keeping" instead. For reasons of accessibility, user 
agents should alvvays make the content of the “title” child element to the outermost svg element available to users. 
"The mechanism for doing so depends on the user agent (e.g., as a caption, spoken). 

The DTD definitions of many of SVGss elements (particularly, container and text elements) place no restric- 
tion on the placement or number of the “desc” and “title” sub-elements. This flexibility is only present so that there 
vvill be a consistent content model for container elements, because some container elements in SVG allovv for 
mixed content, and because the mixed content rules for XML (TXML10), section 3.2.2) do not permit the desired 
restrictions. Representations of future versions of the SVG language might use more expressive representations 
than DTDs vvhich allovv for more restrictive mixed content rules. İt is strongly recommended that at most one 
“desc” and at most one “title” element appear as a child of any particular element, and that these elements appear 
before any other child elements (except possibly “metadata” elements) or character data content. If user agents need 
to choose among multiple “desc” or “title” elements for processing (e.g., to decide vvhich string to use for a tooltip), 
the user agent shall choose the first one. 


5.5 The “symbol” element 


Categories: “symbol” 
Container element, structural element 


Content model: 
Any number of the follovving elements, in any order: 
animation elements 
descriptive elements 
shape elements 
structural elements 
gradient elements 
.” 
“altGiyphDef” 
“clipPath” 


“color-profile” 
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“cursor” 

“filter” 

“font” 

“font-face” 

“ToreignObiect” 

“image” 

“marker” 

“mask” 

“pattern” 

“script” 

“style” 

“svvitch” 

“text” 

“vievv” 

Attributes: 

core attributes 
graphical event attributes 
presentation attributes 
“class” 
“style” 
“externalResourcesRequired” 
“preserveAspectRatio” 


“vievvBox” 


DOM Tnterfaces: 
SVGSymbolElement 


The “symbol” element is used to define graphical template obfects vvhich can be instantiated by a “use” element. 
The use of “symbol” elements for graphics that are used multiple times in the same document adds structure 
and semantics. Documents that are rich in structure may be rendered graphically, as speech, or as braille, and thus 
promote accessibility. 
The key distinctions betvveen a “symbol” and a “g” are: 


e A “symbol” element itself is not rendered. Only instances of a “symbol” element (i.e., a reference to a “symbol” 
by a “use” element) are rendered. 

e A “symbol” element has attributes “vievvBox” and “preserveAspectRatio” vvhich allovv a “symbol” to scale-to-fit 
vvithin a rectangular vievvport defined by the referencing “use” element. 


Closely related to the “symbol” element are the “marker” and Pattern” elements. 
“symbol” elements are never rendered direetly: their only usage is as something that can be referenced using 
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the “use” element. The “display” property does not apply to the “symbol” element: thus, “symbol” elements are not 
directly rendered even if the “display” property is set to a value other than none, and “symbol” elements are avail- 
able for referencing even vvhen the “display” property on the “symbol” element or any of its ancestors is set to none. 


5.6 The “use” element 


Categories: use” 
Graphics element, graphics referencing element, structural element 


Content model: 
Any number of the follovving elements, in any order: 
animation elements 
descriptive elements 


Attributes: 
core attributes 
conditional processing attributes 
graphical event attributes 
presentation attributes 
xlink attributes 
“class” 
“style” 
“externalResourcesRequired” 
“transform” 


sız 


x 


(arı) 


y 
“vvidth” 
“height” 
“xlink:href” 


DOM Tnterfaces: 
SVGUseElement 


Any “svg”, “symbol”, “g”, graphics element or other “use” is potentially a template obiect that can be re-used (i.e., 
"instanced") in the SVG document via a “use” element. The “use” element references another element and indicates 
that the graphical contents of that element is included/dravvn at that given point in the document. 

Unlike “image”, the “use” element cannot reference entire files. 

The “use” element has optional attributes “x”, “y”, “vridth” and “height” vvhich are used to map the graphical con- 
tents of the referenced element onto a rectangular region vvithin the current coordinate system. 

The effect of a “use” element is as if the contents of the referenced element vvere deeply cloned into a separate 
non-exposed DOM tree vvhich had the “use” element as its parent and all of the “use” elements ancestors as its 


higher-level ancestors. Because the cloned DOM tree is non-exposed, the SVG Document Obiect Model (DOM) 
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only contains the “use” element and its attributes. The SVG DOM does not shovv the referenced elements contents 
as children of “use” element. 

For user agents that support Styling vvith CSS, the conceptual deep cloning of the referenced element into 
a non-exposed DOM ftree also copies any property values resulting from the CSS cascade (TCSS2), chapter 6) on 
the referenced element and its contents. CSS2 selectors can be applied to the original (i.e., referenced) elements 
because they are part of the formal document structure. CSS2 selectors cannot be applied to the (conceptually) 
cloned DOM tree because its contents are not part of the formal document structure. 

Property inheritance, hovvever, vvorks as if the referenced element had been textually included as a deeply 
cloned child of the “use” element. The referenced element inherits properties from the “use” element and the “use” 
elements ancestors. An instance of a referenced element does not inherit properties from the referenced elements 
original parents. 

If event attributes are assigned to referenced elements, then the actual target for the event vvill be the SVGEle- 
mentinstance obiect vvithin the "instance tree" corresponding to the given referenced element. 

The event handling for the non-exposed tree vvorks as if the referenced element had been textually included 
as a deeply cloned child of the “use” element, except that events are dispatched to the SVGElementlnstance obiects. 
"The events target and currentTarget attributes are set to the SVGElementinstance that corresponds to the target 
and current target elements in the referenced subtree. An event propagates through the exposed and non-exposed 
portions of the tree in the same manner as it vvould in the regular document tree: first going from the root ele- 
ment to the “use” element and then through non-exposed tree elements in the capture phase, follovved by the target 
phase at the target of the event, then bubbling back through non-exposed tree to the use element and then back 
through regular tree to the root element in bubbling phase. 

An element and all its corresponding SVGElementlnstance obiects share an event listener list. The currentTar- 
get attribute of the event can be used to determine through vvhich obyect an event listener vvas invoked. 

The behavior of the “visibility” property conforms to this model of property inheritance. Thus, specifying "vis- 
ibility:hidden" on a “use” element does not guarantee that the referenced content vvill not be rendered. If the “use” 
element speciftes "visibility:hidden" and the element it references speciftes "visibility:hidden" or "visibility:inherit, 
then that one element vvill be hidden. Hovvever, if the referenced element instead speciftes "isibility:visible", then 
that element vvill be visible even if the “use” element speciftes "visibility:hidden". 

Animations on a referenced element vvill cause the instances to also be animated. 

A “use” element has the same visual effect as if the “use” element vvere replaced by the follovving generated 


content: 
e If the “use” element references a “symbol” element: 


Im the generated content, the “use” vvill be replaced by “g,, vrhere all attributes from the “use” element except 
for “x”, “y”, “vvidih”, “height” and “xlink:href” are transferred to the generated “g” element. An additional trans- 
formation translate(x,y) is appended to the end (1e., right-side) of the “transform” attribute on the generated 
“g”, vvhere x and y represent the values of the “x” and /y” attributes on the “use” element. The referenced “sym- 
bol” and its contents are deep-cloned into the generated tree, vvith the exception that the “symbol” is replaced 
by an “svg”. This generated “svg” vvill alvvays have explicit values for attributes “vvidih” and “heighi”. If attrib- 
utes “vidih” and/or “height” are provided on the “use” element, then these attributes vvill be transferred to the 


generated “svg”. If attributes “vvidih” and/or “heighi” are not specifted, the generated “svg” element vvill use val- 


ues of "10077" for these attributes. 


e If the “use” element references an “svg” element: 
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Im the generated content, the “use” vvill be replaced by “g,, vrhere all attributes from the “use” element except 
for “x”, “y”, “vvidth”, “height” and “xlink:href” are transferred to the generated “g” element. An additional trans- 
formation translate(x,y) is appended to the end (1e., right-side) of the “transform” attribute on the generated 
“g”, vrhere x and y represent the values of the “x” and “y” attributes on the “use” element. The referenced “svg” 
and its contents are deep-cloned into the generated tree. If attributes “vvidih” and/or “height” are provided on 
the “use” element, then these values vvill override the corresponding attributes on the “svg” in the generated 


İree. 


e Othervvise: 





In the generated content, the “use” vvill be replaced by “g,, vrhere all attributes from the “use” element except 
for “x”, “y”, “vvidih”, “height” and “xlink:href” are transferred to the generated “g” element. An additional trans- 
formation translate(x,y) is appended to the end (1.e., right-side) of the “transform” attribute on the generated 
“g”, vvhere x and y represent the values of the “x” and “y” attributes on the “use” element. The referenced obiect 
and its contents are deep-cloned into the generated tree. 


For user agents that support Styling vvith CSS, the generated “g” element carries along vvith it the "cascaded" prop- 
erty values on the “use” element vvhich result from the CSS cascade (İCSS2l, chapter 6). Additionally, the copy 
(deep clone) of the referenced resource carries along vvith it the "cascaded" property values resulting from the CSS 
cascade on the original (i.e., referenced) elements. Thus, the result of various CSS selectors in combination vvith 
the “class” and “style” attributes are, in effect, replaced by the functional equivalent of a “style” attribute in the gen- 
erated content vvhich conveys the "cascaded" property values. 

Example Use01 belovv has a simple “use” on a “rect”. 


c?xml version-"1.0" standalone-"no"?5 
x DOCTYPE svg PUBLİC "-//V3C//DTD SVG 1.1//EN" 
"http: / /vvv/.v/3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
€svg vidth-"10cm" height-"3cm" vievBoxz"0 0 100 30" versionz"1.1" 
xmlnsze"http: / /vuv/ .v(3.0T9/2000/svg" xmlns:xlinke"http://vvv.v3.org/1999/xlink"s 
edescsExample Use01 - Simple case of "use" on a "rect"-/desc” 
edefss 
crect id-"MyRect" vidth-"60" height-"10"/5 
c/defso- 
crect xe".1" ye".1" vidth-"99.8" height-"29.8" 
fill-"none" strokez"blue" stroke-vidthez".2" /s 
cuse xe"20" ye"10" xlink:href-"ZMyRect" /x 
s/ svg” 


Example Use01 





c 
.o 
5 
İv) 
m") 
İs 
(3) 
E 
E 
ə) 
(ə) 
o 
cc 
. 
- 











"The visual effect vvould be equivalent to the follovving document: 


c?xml versionz"1.0" standalone-"no"?z 
x DOCTYPE svg PUBLİC "-//V/3C/ /DTD SVG 1.1//EN" 
"http: / /vvv/.vV3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
€Ssvg vidthe"10cm" height-"3cm" vievBoxe"0 0 100 30" 
xmlnse"http: / /uvv .vV3.0rg/2000/svg" versionze"1.1"5 
edescsExample Use01-GeneratedContent - Simple case of "use" on a "rect"-c/desc- 
c1-- "defs" section left out --s 





crect xe".1" ye".1" vidth-"99.8" height-"29.8" 
fill-"none" strokez"blue" stroke-vidthe".2" /s 


c1-- Start of generated content. Replaces "use" --x 
sg transforme"translate(20,10)"- 
crect vidth-"60" height-"10"/5 
x/g” 
c1-- End of generated content --x 


x/ svg” 


Example Use02 belovv has a “use” on a “symbol”. 


c?xml versionz"1.0" standalonez"no"?x 
x İDOCTYPE. svg PUBLİC "-//0/3C//DTD SVG 1.1//EN" 
"http: / /vv/.v/3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
€Ssvg vidthe-"10cm" height-"3cm" vieuvBoxe"0 0 100 30" versione"1.1" 
xmlnsze"http: / /vuv/ .v(3.0T9/2000/svg" xmlns:xlinke"http://vvv.v3.org/1999/xlink"s 
edescsExample Use02 - "use" on a "symbo1"-/desc” 
edefss 
csymbol ide"MySymbol" vievBoxz"0 0 20 20"- 
edescəoMySymbol - four rectangles in a grid-/desc- 
crect xe"1" ye"1" vidth-"8" heightz"8"/ 
crect xe"11" ye"1" vidth-"8" height-"8"/5 
crect xe"1" y-"11" vidth-"8" height-"8"/- 
crect xe"11" ye"11" vidth-"8" height-"8"/5 
sc/ symbol- 
c/defs- 
crect xe".1" ye".1" vidth-"99.8" height-"29.8" 
fill-"none" strokez"blue" stroke-vidthz".2" /s 
suse xe"45" ye-"10" vidth-"10" height-"10" 
xlink:hrefe"ZöMySymbol" /5 








x/ svg” 


Example Use02 
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"The visual effect vvould be equivalent to the follovving document: 


c?xml versionz"1.0" standalone-"no"?z 
x DOCTYPE svg PUBLİC "-//3C///DTD SVG 1.1//EN" 
"http: / /vvv/.v/3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
€Svg vidth-"10cm" height-"3cm" vievBoxe"0 0 100 30" 
xmlnse"http: / /vvv .v3.o0rg/2000/svg" versionze"1.1"5 
edescxExample Use02-GeneratedContent - "use" on a "symbo1"-/descx 


c1-- "defs" section left out --x 


crect xe".1" ye".1" vidth-"99.8" height-"29.8" 
fill-"none" strokez"blue" stroke-vidthe".2" /s 


c1-- Start of generated content. Replaces "use" --s 
€g transforme"translate(45, 10)" s 
c1-- Start of referenced "symbol". "symbol" replaced by "svg", 


vith x,y,vidth,heightz0,0, 10055, 10056 --” 
€SVg vidthe"10" height-"10" 
vieuvBoxz"0 0 20 20" 
crect xe"1" ye"1" vidth-"8" heightz"8"/5 
crect xe"11" ye"1" vidth-"8" height-"8"/5 
crect xe"1" ye"11" vidthe"8" heighte"8"/- 
crect xe"11" ye-"11" vidth-"8" heighte"8"/5 
c/ svg” 
c1-- End of referenced symbol --x 
x/g” 
c1-- End of generated content --x 








xs/ svg” 


Example Use03 illustrates vvhat happens vvhen a “use” has a “transform: attribute. 


c?xml versionz"1.0" standalone-"no"?x 
x DOCTYPE svg PUBLİC "-//V3C//DTD SVG 1.1//EN" 
"http: / /vvv/.v/3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
€Svg vidthe-"10cm" height-"3cm" vieuvBoxe"0 0 100 30" versione"1.1" 
xmlnsz"http: / /vuv/ .v(3.0T9/2000/svg" xmlns:xlinke"http://vuv.v3.org/1999/xlink"s 


edescsExample Use03 - "use" vith a "transform" attribute-c/desc” 
edefsəs 

crect ide"MyRect" xe"0" y-"0" vidth-"60" heighte-"10"/5 
c/defs- 


crect xe".1" ye".1" vidth-"99.8" height-"29.8" 
fill-"none" strokez"blue" stroke-vidthe".2" /s 
suse xlink:hrefe"ZMyRect" 
transform-"translate(20,2.5) rotate(10)" /s 
s/ svg” 


Example Use03 

















"The visual effect vvould be equivalent to the follovving document: 


c?xml versionz"1.0" standalonez"no"?z 
xc DOCTYPE svg PUBLİC "-//V/3C/ /DTD SVG 1.1//EN" 
"http: / /vuv/.vV3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
€Ssvg vidthe"10cm" height-"3cm" vievBoxze"0 0 100 30" 
xmlnse"http: / /vvv .vV3.o0rg/2000/svg" versionze"1.1"5 
edescsExample Use03-GeneratedContent - "use" vith a "transform" attribute-c/desc” 


c1-- "defs" section left out --x 


crect xe".1" ye".1" vidth-"99.8" height-"29.8" 
fill-"none" strokez"blue" stroke-vidthe".2" /s 


c1-- Start of generated content. Replaces "use" --xs 
sg transform-"translate(20,2.5) rotate(10)"5 
xrect xe"0" yz-"0" vidth-"60" height-"10"/5 
x/g” 
c1-- End of generated content --s 
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x/ svg” 


Example Use04 illustrates a “use” element vvith various methods of applying CSS styling. 


c?xml versionz"1.0" standalonez"no"?z 
€ DOCTYPE svg PUBLİC "-//V3C//DTD SVG 1.1//EN" 
"http: / /vvv/.vV3.org/Graphics/SVG/1.1/DTD/svg11.dtd"s 
x€svg vidth-"12cm" height-"3cm" vievBox-"0 0 1200 300" version-"1.1" 
xmlnsz"http: / /vuv/ .v(3.0T9/2000/svg" xmlns:xlinke"http://vvv.v3.org/1999/xlink"s 
edescsExample Use04 - "use" vith CSS styling-c/descə” 
edefs styleze" /” rule 9 “/ stroke-miterlimit: 10" 5 
cpath id-"MyPath" d-"M300 50 L900 50 L900 250 L300 250" 
class-"MyPathClass" 
stylez" /” rule 10 “/ stroke-dasharray:300, 100" /5 





xe/defss 
estyle typeze"text/css"x 
€ İCDATAT 
/“ rule 1 “/ öMyüse f fill: blue ) 
/“ rule 2 “/ öMyPath ( stroke: red ) 
/” rule 3 “/ use ( fill-opacity: .5) 
/” rule 4 “/ path ( stroke-opacity: .5)1 
/“ rule 5 “/ .MyUseClass ( stroke-linecap: round ) 
/8 rule 6 “€/ .MyPathClass (f stroke-linefoin: bevel ) 
/” rule 7 “/ use x path ( shape-rendering: optimizeQuality ) 
/” rule 8 “/ g x path ( visibility: hidden ) 
11: 
e/styles 


crect xe"0" y-"0" vidth-"1200" height-"300" 
stylez-"fill:none, stroke:blue, stroke-vidth:3"/5 

€g stylez" /“ rule 11 “/ stroke-vidth:40"5 

cuse ide"MyUse" xlink:href-"ZMyPath" 

classe"MyüseClass" 
stylez"/” rule 12 “/ stroke-dashoffset:50" /5 

x/g” 

s/ svg” 


Example Use04 











"The visual effect vvould be equivalent to the follovving document. Observe that some of the style rules above apply 
to the generated content (i.e., rules 1-6, 10-12), vvhereas others do not (i.e., rules 7-9). The rules vvhich do not affect 
the generated content are: 


e Rules 7 and 8: CSS selectors only apply to the formal document tree, not on the generated tree: thus, these 
selectors vvill not yield a match. 
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e Rule 9: The generated tree only inherits from the ancestors of the “use” element and does not inherit from the 
ancestors of the referenced element: thus, this rule does not affect the generated content. 


In the generated content belovv, the selectors that yield a match have been transferred into inline “style” attributes 
for illustrative purposes. 


c?xml versionz"1.0" standalone-"no"?5 
xc DOCTYPE svg PUBLİC "-//V/3C/ /DTD SVG 1.1//EN" 
"http: / /vvv/.v/3.org/Graphics/SVG/1.1/DTD/svg11.dtd"s 
x€svg vidth-"12cm" height-"3cm" vievBoxz"0 0 1200 300" 
xmlnsze"http: / /vv/ .v(3.0T9/2000/svg" versionz"1.1"5 
edescsExample Use04-GeneratedContent - "use" vith a "transform" attributec/desc” 


€1-- "style" and "defs" sections left out --s 
crect xe"0" ye"0" vidth-"1200" height-"300" 
stylee"fill:none, stroke:blue, stroke-vidth:3"/5 
sg stylez"/“ rule 11 “/ stroke-vidth:40"5 
c1-- Start of generated content. Replaces "use" --5 
€g styleze"/” rule 1 “/ fill:blue, 
/” rule 3 “€/ fill-opacity:.5, 
/” rule 5 “/ stroke-linecap: round, 
/” rule 12 ”/ stroke-dashoffset:50" xs 
cpath d-"M300 50 L900 50 L900 250 L300 250" 
stylez"/” rule 2 “/ stroke:red, 
/” rule 4 “/ stroke-opacity:.5, 
/5 rule 6 “/ stroke-lineioin: bevel, 
/” rule 10 “/ stroke-dasharray:300, 100" /5 
x/g” 
c1-- End of generated content --s 


x/g” 
x/ svgx 


VVhen a “use” references another element vvhich is another “use” or vvhose content contains a “use” element, then 
the deep cloning approach described above is recursive. Hovvever, a set of references that directly or indirectly 
reference a element to create a circular dependeney is an error, as described in References and the “defs” element. 


Attribute definitions: 


x — "-ccoordinate”" 
"The x-axis coordinate of one corner of the rectangular region into vvhich the referenced element is placed. 
If the attribute is not specifted, the effect is as if a value of "0" vvere specifted. 
Animatable: yes. 


y — "-coordinate-" 
"The y-axis coordinate of one corner of the rectangular region into vvhich the referenced element is placed. 
If the attribute is not specifted, the effect is as if a value of "0" vvere specifted. 
Animatable: yes. 


vidth - "-length-" 
"The vvidth of the rectangular region into vvhich the referenced element is placed. A negative value is an error 
(see Error processing). A value of zero disables rendering of this element. 
Animatable: yes. 


height - "-length:" 
"The height of the rectangular region into vvhich the referenced element is placed. A negative value is an error 
(see Error processing). A value of zero disables rendering of this element. 
Animatable: yes. 
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xlink:href - "-iri-" 
A IRI reference to an element/fragment vvithin an SVG document. 
Animatable: yes. 


5.7 The image” element 


Categories: “image” 
Graphics element, graphics referencing element 





Content model: 
Any number of the follovving elements, in any order: 
animation elements 
descriptive elements 


Attributes: 
core attributes 
conditional processing attributes 
graphical event attributes 
xlink attributes 
presentation attributes 
“class” 
“style” 
“externalResourcesRequired” 
“preserveAspectRatio” 
“transform” 


..—. 


xXx 


əə: 


y 
“vvidth” 
“height” 
“xlink:href” 
DOM Tnterfaces: 
SVGlimageElement 


The “image” element indicates that the contents of a complete file are to be rendered into a given rectangle vvithin 
the current user coordinate system. The “image” element can refer to raster image files such as PNG or IPEG or to 
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files vvith MIME type of "image/svgixml". Conforming SVG vievvers need to support at least PNG, /PEG and SVG 
format files. 

The result of processing an “image” is alvvays a four-channel RGBA result. VVhen an “image” element references 
a raster image file such as PNG or /PEG files vvhich only has three channels (RGB), then the effect is as if the obiect 
vvere converted into a 4-channel RGBA image vvith the alpha channel uniformly set to 1. For a single-channel 
raster image, the effect is as if the obfect vvere converted into a 4-channel RGBA image, vvhere the single channel 
from the referenced obiect is used to compute the three color channels and the alpha channel is uniformİy set to 1. 

An “image” element establishes a nevv vievvport for the referenced file as described in Establishing a nevv 
vievvport. The bounds for the nevv vievrport are defined by attributes “x”, “y”, “vvidih” and “height”. The placement 
and scaling of the referenced image are controlled by the “preserveAspectRatio” attribute on the “image” element. 

VVhen an “image” element references an SVG image, the “clip” and “overflovv” properties on the root element 
in the referenced SVG image are ignored (in the same manner as the “x”, “y,, “vvidih” and “height” attributes are ig- 
nored). Unless the value of “preserveAspectRatio” on the “image” element starts vvith "defer, the “preserveAspeciRa- 
tio” attribute on the root element in the referenced SVG image is also ignored (see “preserveAspectRatio” for details). 
Imnstead, the “preserveAspectRatio” attribute on the referencing “image” element defines hovv the SVG image content 
is fitted into the vievvport and the “clip” and “overflovv” properties on the “image” element define hovv the SVG image 
content is clipped (or not) relative to the vievvport. 

The value of the “vievvBox” attribute to use vvhen evaluating the “preserveAspectRatio” attribute is defined by 
the referenced content. For content that clearly identifies a vievvBox (e.g. an SVG file vvith the “vievvBox” attribute 
on the outermost svg element) that value should be used. For most raster content (PNG, IPEG) the bounds of the 
image should be used (i.e. the “image” element has an implicit “vievvBox” of "0 0 raster-image-vvidth raster-image- 
height"). V/here no value is readily available (e.g. an SVG file vvith no “vievvBox” attribute on the outermost svg 
element) the “preserveAspectRatio” attribute is ignored, and only the translation due to the “x” 6c “y” attributes of 
the vievvport is used to display the content. 

For example, if the image element referenced a PNG or IPEG and preserveAspectRatio-"xMinYMin meet", 
then the aspect ratio of the raster vvould be preserved (vvhich means that the scale factor from images coordinates 
to current user space coordinates vvould be the same for both X and Y), the raster vvould be sized as large as pos- 
sible vvhile ensuring that the entire raster fits vvithin the vievvport, and the top/left of the raster vvould be aligned 
vvith the top/left of the vievvport as defined by the attributes “x”, “y”, “vvidih” and “height” on the “image” element. 
If the value of “preserveAspectRatio” vvas "none" then aspect ratio of the image vvould not be preserved. The image 
vvould be fitted such that the top/left corner of the raster exactly aligns vvith coordinate (x”, “y”) and the bottom/ 
right corner of the raster exactly aligns vvith coordinate (x”s“vvidth”, “y”““height”). 

The resource referenced by the “image” element represents a separate document vvhich generates its ovvn parse 
tree and document obiect model (if the resource is XML). Thus, there is no inheritance of properties into the image. 

Unlike “use”, the “image” element cannot reference elements vvithin an SVG file. 


Attribute definitions: 


x — "-coordinates" 
"The x-axis coordinate of one corner of the rectangular region into vvhich the referenced document is placed. 
If the attribute is not specifted, the effect is as if a value of "0" vvere specifted. 
Animatable: yes. 
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y — "-coordinates-" 
"The y-axis coordinate of one corner of the rectangular region into vvhich the referenced document is placed. 
If the attribute is not specifted, the effect is as if a value of "0" vvere specifted. 
Animatable: yes. 


vidth - "-lengths" 
The vvidth of the rectangular region into vvhich the referenced document is placed. 
A negative value is an error (see Error processing). A value of zero disables rendering of the element. 
Animatable: yes. 


height — "-length-" 
"The height of the rectangular region into vvhich the referenced document is placed. 
A negative value is an error (see Error processing). A value of zero disables rendering of the element. 


Animatable: yes. 


xlink:href - "-iri-" 
A TRI reference. 
Animatable: yes. 


preserveAspectRatio — "İdeferl -align- T-meetOrsSlice-1" 
See “preserveAspectRatio”. 
If attribute “preserveAspectRatio” is not specifted, then the effect is as if a value of xMidYMid meet vvere 


specifted. 
Animatable: yes. 


An example: 


c?xml versione"1.0" standalonez"no"?s 
x DOCTYPE svg PUBLİC "-//03C//DTD SVG 1.1//EN" 
"http: / /vəvv .v/3.org/Graphics/SVG/1.1/DTD/svg11.dtd"s 
xsvg vidth-"4in" height-"3in" versionz"1.1" 
xmlnse"http:/ /uvuv.v3.0r9/2000/svg" xmlns:xlinke"http://uvvv.v3.org/1999/xl1ink"s 
edescsThis graphic links to an external image 
xs/descə” 
cimage xz"200" yz"200" vidth-"100px" height-"100px" 
xlink:href-"myimage.png"x 
etitlesMy imagec/titles 
c/imagex 
x/ svg” 


5.8 Conditional processing 


5.8.1 Conditional processing overvievv 


SVG contains a “svritch” element along vvith attributes “requiredFeatures”, “requiredExtensions” and “systemLan- 
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guage” to provide an ability to specify alternate vievving depending on the capabilities of a given user agent or the 
users language. 

Attributes “requiredFeatures”, “requiredExtensions” and “systemLanguage” act as tests and return either true or 
false results. The “svvitch” renders the first of its children for vvhich all of these attributes test true. If the given at- 
tribute is not specifted, then a true value is assumed. 

Similar to the “display” property, conditional processing attributes only affect the direct rendering of elements 
and do not prevent elements from being successfully referenced by other elements (such as via a “use”). 

Im consequence: 

e “requiredFeatures”, “requiredExtensions” and “systemLanguage” attributes affect “a”, “altGlyph”, “foreignObiect”, 

“textPath”, “ref”, and “tspan” elements. 

e “requiredFeatures”, “requiredExtensions” and “systemLanguage” attributes vvill have no effect on “mask”, 

“clipPath”, and “pattern” elements. 

e “requiredFeatures”, “requiredExtensions” and “systemLanguage” attributes do not applİy to the “defs”, and “cursor” 
elements because they are not part of the rendering tree. 

e “requiredFeatures”, “requiredExtensions” and “systemLanguage” attributes affect “animate”, “animateColor”, “an- 
imateMotion”, “animateTransform?, and “set” elements. If the conditional statement on these animation ele- 
ments fails, the animation vvill never be triggered. 


5.8.2 The “svvitch” element 


Categories: “svvitch” 
Container element 


Content model: 
Any number of the follovving elements, in any order: 
animation elements 
descriptive elements 
shape elements 
.” 
“ToreignObiect” 
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image” 
“sv” 
“svvitch” 
“text” 


c , 


use 


Attributes: 
conditional processing attributes 
core attributes 
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graphical event attributes 
presentation attributes 
“class” 

“style” 
“externalResourcesRequired” 


“transform” 


DOM Tnterfaces: 
SVGSvvitechElement 


"The “svvitch” element evaluates the “requiredFeatures”, “requiredExtensions” and “systemLanguage” attributes on its 
direct child elements in order, and then processes and renders the first child for vvhich these attributes evaluate to 
true. AİI others vvill be bypassed and therefore not rendered. İf the child element is a container element such as a 
“g”, then the entire subtree is either processed/rendered or bypassed/not rendered. 

Note that the values of properties “display” and “visibility” have no effect on “svvitch” element processing. In 
particular, setting “display” to none on a child of a “svvitch” element has no effect on true/false testing associated 
vvith “svvitch” element processing. 

For more information and an example, see Embedding foreign obiect types. 


5.8.3 The “requiredFeatures” attribute 
Definition of requiredFeatures: 


requiredFeatures — l/isf-of-features 
"The value is a list of feature strings, vvith the individual values separated by vvhite space. Determines vvhether 
all of the named feafures are supported by the user agent. Only feature strings defined in the Feature String 
appendix are allovved. If all of the given features are supported, then the attribute evaluates to true, other- 
vvise, the current element and its children are skipped and thus vvill not be rendered. 
Animatable: no. 


If the attribute is not present, then its implicit return value is "true". If a null string or empty string value is given 
to attribute “requiredFeatures”, the attribute returns "false", 

“requiredFeatures” is often used in conyğunction vvith the “svvitch” element. If the “requiredFeatures” is used in 
other situations, then it represents a simple svvitch on the given element vvhether to render the element or not. 


5.8.4 The “requiredExtensions” attribute 


"The “requiredExtensions” attribute defines a list of required language extensions. Language extensions are capabil- 
ities vvithin a user agent that go beyond the feature set defined in this specification. Each extension is identifted by 
an IRİ reference. 
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Definition of requiredExtensions: 


requiredExtensions — lisf-of-extensions 
"The value is a list of IRI references vvhich identify the required extensions, vvith the individual values sep- 
arated by vvhite space. Determines vvhether all of the named exfensions are supported by the user agent. If 
all of the given extensions are supported, then the attribute evaluates to true: othervvise, the current element 
and its children are skipped and thus vvill not be rendered. 
Animatable: no. 


If a given IRI reference contains vvhite space vvithin itself, that vvhite space must be escaped. 

If the attribute is not present, then its implicit return value is "true". If a null string or empty string value is 
given to attribute “requiredExtensions”, the attribute returns "false", 

“requiredExtensions” is often used in conyunction vvith the “svvitch” element. If the “requiredExtensions” is used 
in other situations, then it represents a simple svvitch on the given element vvhether to render the element or not. 

The IRİ names for the extension should include versioning information, such as "http://example.org/SVGEx- 
tensionXYZ/1.0", so that script vvriters can distinguish betvveen different versions of a given extension. 


5.8.5 The “systemLanguage” attribute 


The attribute value is a comma-separated list of language names as defined in BCP 47 İBCPA47). 

Evaluates to "true" if one of the languages indicated by user preferences exactly equals one of the languages 
given in the value of this parameter, or if one of the languages indicated by user preferences exactly equals a prefix 
of one of the languages given in the value of this parameter such that the first tag character follovving the prefix is 

Evaluates to "false" othervvise. 

Note: This use of a prefix matching rule does not imply that language tags are assigned to languages in such 
a vvay that it is alvvays true that if a user understands a language vvith a certain tag, then this user vvill also under- 
stand all languages vvith tags for vvhich this tag is a prefix. 

The prefix rule simpiy allovvs the use of prefix tags if this is the case. 

Implementation note: VVhen making the choice of linguistic preference available to the user, implementers 
should take into account the fact that users are not familiar vvith the details of language matching as deseribed 
above, and should provide appropriate guidance. As an example, users may assume that on selecting "en-gb", they 
vvill be served any kind of English document if British English is not available. The user interface for setting user 
preferences should guide the user to add "en" to get the best matching behavior. 

Multiple languages MAY be listed for content that is intended for multiple audiences. For example, content 
that is presented simultaneously in the original Maori and English versions, vvould call for: 

etext systemLanguageze"mi, en"xcl-- content goes here --sc/text- 
Hovvever, fust because multiple languages are present vvithin the obfect on vvhich the “systemLanguage” test at- 
tribute is placed, this does not mean that it is intended for mulltiple linguistic audiences. An example vvould be a 
beginner"s language primer, such as "A First Lesson in Latin,/ vvhich is clearly intended to be used by an English- 
literate audience. In this case, the “systemLanguage” test attribute should only include "en". 

Authoring note: Authors should realize that if several alternative language obyects are enclosed in a “svvitch,, 
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and none of them matches, this may lead to situations vvhere no content is displayed. It is thus recommended to 
include a "catch:-all" ehoice at the end of such a “svriteh” vvhich is acceptable in all cases. 

For the “systemLanguage” attribute: Animatable: no. 

If the attribute is not present, then its implicit return value is "true". If a null string or empty string value is 
given to attribute “systemLanguage”, the attribute returns "false", 

“systemLanguage” is often used in con/unction vvith the “svvitch” element. If the “systemLanguage” is used in 
other situations, then it represents a simple svvitch on the given element vvhether to render the element or not. 


5.8.6 Applicability of test attributes 


"The follovving list deseribes the applicability of the test attributes to the elements that do not directly produce ren- 
dering. 


e the test attributes do not effect the “mask”, “clipPath”, “inearGradient”, “radialGradient” and “pattern” elements. 
The test attributes on a referenced element do not affect the rendering of the referencing element. 

e the test attributes do not effect the “defs”, and “cursor” elements as they are not part of the rendering tree. 

e an animation element ("animate”, “animateMotion”, “animateTransform”, “animateColor” and “set”) vvill never be 


triggered if it has a test attribute that evaluates to false. 


5.9 Specifying vvhether external resources are required for proper ren- 
dering 


Documents often reference and use the contents of other files (and other VVeb resources) as part of their rendering. 
In some cases, authors vvant to specify that particular resources are required for a document to be considered cor- 
TeCt. 

Attribute “externalResourcesRequired” is available on all container elements and to all elements vvhich poten- 
tially can reference external resources. İt specifies vvhether referenced resources that are not part of the current 
document are required for proper rendering of the given container element or graphics element. 


Attribute definition: 


externalResourcesRequired - "false I true" 


false 
(The default value.) Indicates that resources external to the current document are optional. Document 
rendering can proceed even if external resources are unavailable to the current element and its des- 
cendants. 


İrue 
Indicates that resources external to the current document are required. If an external resource is not 
available, progressive rendering is suspended, the documentis SVGLoad event is not fired and the an- 
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imation timeline does not begin until that resource and all other required resources become available, 
have been parsed and are ready to be rendered. İf a timeout event occurs on a required resource, then 
the document goes into an error state (see Error processing). The document remains in an error state 
until all required resources become available. 


"This attribute applies to all types of resource references, including style sheets, color profiles (see Color profile de- 
scriptions) and fonts specifted by an IRI reference using a “font-face” element or a CSS (Əfont-face specification. 
In particular, if an element sets externalResourcesRequired-"true", then all style sheets must be available since any 
style sheet might affect the rendering of that element. 

Attribute “externalResourcesRequired” is not inheritable (from a sense of attribute value inheritance), but if set 
on a container element, its value vvill apply to all elements vvithin the container. 

Because setting externalResourcesRequired-"true" on a container element vvill have the effect of disabling pro- 
gressive display of the contents of that container, if that container includes elements that reference external re- 
sources, tools that generate SVG content are cautioned against simply setting externalResourcesRequired-"true" on 
the outermost svg element on a universal basis. Instead, it is better to specify externalResourcesRequired-"true" 
on those particular graphics elements or container elements vvhich specifically need the availability of external 
resources in order to render properly. 

For “externalResourcesRequired”: Animafable: no. 


5.10 Common attributes 


5.10.1 Attributes common to all elemenis: “id” and “xml:base” 
The “id” and “xmlibase” attributes are available on all SVG elements: 
Attribute definitions: 


id — "name" 
Standard XML attribute for assigning a unique name to an element. Refer to the Extensible Markup Lan- 
guage (XML) 1.0 Recommendation İXML10). 
Animatable: no. 


xml :base £ "-iri-" 
Speciftes a base IRI other than the base IRI of the document or external entity. Refer to the XML Base spe- 


cification PXML-BASEİ. 
Animatable: no. 


5.10.2 The “xml:lang” and “xml:space” attributes 


Elements that might contain character data content have attributes “xml:lang” and “xml:space”. 
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Attribute definitions: 


xml:1ang - "languagelD" 
Standard XML attribute to specify the language (e.g., English) used in the contents and attribute values of 
particular elements. Refer to the Extensible Markup Language (XML) 1.0 Recommendation EXML101. 
Animatable: no. 


xml: space - "İdefault / preserve)" 
Standard XML attribute to specify vvhether vvhite space is preserved in character data. The only possible 
values are "default" and Tpreserve", Refer to the Exfensible Markup Language (XML) 1.0 Recommendation 
EXML10İ and to the discussion vvhite space handling in SVG. 
Animatable: no. 


5.11 DOM interfaces 


5.11.1 Interface SVGDocument 


VVhen an “svg” element is embedded inline as a component of a document from another namespace, such as vvhen 
an “svg” element is embedded inline vvithin an XHTML document EXHTMLİ, then an SVGDocument obiect vvill 
not exist: instead, the root obyect in the document obiect hierarchy vvill be a Document obiect of a different type, 
such as an HTMLDocument obiect. 

Hovvever, an SVGDocument obiect vvill indeed exist vvhen the root element of the XML document hierarchy 
is an “svg” element, such as vvhen vievving a stand-alone SVG file (i.e., a file vvith MIME type "image/svg-xml"). In 
this case, the SVGDocument obiect vvill be the root obiect of the document obiect model hierarchy. 

m the case vvhere an SVG document is embedded by reference, such as vvhen an XHTML document has an 
“obğect” element vvhose “href” attribute references an SVG document (i.e., a document vvhose MIME type is "image/ 
svgexml" and vvhose root element is thus an “svg/ element), there vvill exist tvvo distinct DOM hierarchies. The first 
DOM hierarchıy vvill be for the referencing document (e.g., an XHTML document). The second DOM hierarcliy 
vvill be for the referenced SVG document. In this second DOM hierarchy, the root obiect of the document obiect 
model hierarchy is an SVGDocument obieet. 

The SVGDocument interface contains a similar list of attributes and methods to the HTMLDocument inter- 
face described in the Document Obiect Model (HTML) Level 1 chapter of the İDOM1) specification. 


interface SV6Document : Document, 
DocumentEvent (1 
readonly attribute DÜUMString title, 
readonly attribute DÜMString referrer, 
readonly attribute DOMString domain, 
readonly attribute DOMString URL, 
readonly attribute SVGSVGElement rootElement, 
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Aftributes: 


e title (readonly DOMString) 


"The title of a document as specifted by the “title” sub-element of the “svg” root element (i.e., -svg”-title-.Here 
is the title-/titles...-/svg”) 


referrer (readonly DOMString) 


Returns the URI of the page that linked to this page. The value is an empty string if the user navigated to the 
page directly (not through a link, but, for example, via a bookmark). 


e domain (readonly DOMString) 


"The domain name of the server that served the document, or a null string if the server cannot be identifted 


by a domain name. 


e URL (readonly DOMString) 


"The complete URI of the document. 


e rootElement (readonly SVGSVGElement) 


"The root “svg” in the document hierarchy. 


5.11.2 Interface SVGSVGElement 


A key interface definition is the SVGSVGElement interface, vvhich is the interface that corresponds to the “svg” 
element. This interface contains various miscellaneous commonly-used utility methods, such as matrix operations 
and the ability to control the time of redravv on visual rendering devices. 

SVGSVGElement extends VievvCSS and DocumentCSS to provide access to the computed values of properties 
and the override style sheet as described in DOM Level 2 Siyle İDOM2STYLEİ. 


interface SVG6SVGElement : SVGElement, 
SV6GTests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVöStylable, 
SVGLocatable, 
SVGFitToVievBox, 
SVGZoomAndPan, 
DocumentEvent, 
VievCSS, 
DocumentCsS (f 


readonly attribute SVGAnimatedLength x, 

readonly attribute SVGAnimatedLength y, 

readonly attribute SVGAnimatedLength vidth, 

readonly attribute SVGAnimatedLength height, 
attribute DOMString contentScriptType setraises(DOüMException), 
attribute DOMString contentStyleType setraises(DOMException) , 


readonly attribute SVGRect vievport, 

readonly attribute float pixelUnitToMillimeterX, 

readonly attribute float pixelUnitToMillimeterY, 

readonly attribute float screenPixelToMillimeterX, 

readonly attribute float screenPixelToMillimeterY, 

readonly attribute boolean useCurrentViev, 

readonly attribute SVGVievSpec currentViev, 
attribute float currentScale, 

readonly attribute SV6GPoint currentTranslate, 
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unsigned long suspendRedrav(in unsigned long maxllaitMilliseconds), 
void unsuspendRedrav(in unsigned long suspendHandLleTD), 

void unsuspendRedravA11(), 

void forceRedrav(), 

void pauseAnimations(), 

void unpauseAnimations(), 

boolean animationsPaused(), 

Tloat getCurrentTime(), 

void setCurrentTime(in float seconds), 

NodeList getIntersectionList(in SV6Rect rect, in SVGElement referenceElement), 
NodeList getEnclosureList(in SVGRect rect, in SVGElement referenceElement), 
boolean checkIntersection(in SVGElement element, in SVGRect rect), 
boolean checkEnclosure(in SVGElement element, in SVGRect rect), 
void deselectAl1(), 

SVGNumber createSVöNumber() , 

SVGLength createSVGLength() , 

SVGAngle createSVGAngle() , 

SVöPoint createSVGPoint(), 

SVGMatrix createSVGMatrix(), 

SVGRect createSVGRect(), 

SV6GTransform createSV6Transforn() , 

SVGTransform createSVGTransformFromMatrix(in SVGMatrix matrix), 
Element getElementById(in DÜMString elementl1d), 





H 


Aftributes: 


x (readonly SVGAnimatedLength) 


Corresponds to attribute “x” on the given “svg” element. 


y (readonly SVGAnimatedLength) 


Corresponds to attribute “y” on the given “svg” element. 


vvidth (readonly SVGAnimatedLength) 


Corresponds to attribute “vridth” on the given “svg” element. 


height (readonly SVGAnimatedLength) 


Corresponds to attribute “height” on the given “svg” element. 


contentSeriptType (DOMString) 


Corresponds to attribute “contentSeriptType” on the given “svg” element. 
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Exceptions on setting 


ə DOMException, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


contentStyleType (DOMSiring) 


Corresponds to attribute “conteniStyleType” on the given “svg” element. 
Exceptions on setting 


ə DOMException, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


vievvport (readonly SVGRect) 


"The position and size of the vievvport (implicit or explicit) that corresponds to this “svg” element. VVhen the 
user agent is actually rendering the content, then the position and size values represent the actual values 
vvhen rendering. The position and size values are unitless values in the coordinate system of the parent ele- 
ment. If no parent element exists (i.e., “svg” element represents the root of the document tree), if this SVG 
document is embedded as part of another document (e.g., via the HTML “obiect” element), then the position 
and size are unitless values in the coordinate system of the parent document. (If the parent uses CSS or XSL 
layout, then unitless values represent pixel units for the current CSS or XSL vievvport, as described in the 
CSS2 specification.) If the parent element does not have a coordinate system, then the user agent should 
provide reasonable default values for this attribute. 
The SVGRect obieet is read only. 


pixelUnitToMillimeterX (readoniy float) 


Size of a pixel units (as defined by CSS2) along the x-axis of the vievvport, vvhich represents a unit somevvhere 
in the range of 70dpi to 120dpi, and, on systems that support this, might actually match the characteristics of 
the target medium. On systems vvhere it is impossible to knovv the size of a pixel, a suitable default pixel size 
is provided. 


pixelUnitToMillimeterY (readoniy float) 


Corresponding size of a pixel unit along the y-axis of the vievvport. 


screenPixelToMillimeterX (readoniy float) 


User interface (UT) events in DOM Level 2 indicate the screen positions at vvhich the given Ul event occurred. 
VVhen the user agent actually knovvs the physical size of a "screen unit", this attribute vvill express that in- 
formation: othervvise, user agents vvill provide a suitable default value such as .28mm. 


e screenPixelToMillimeterY (readonly float) 


Corresponding size of a screen pixel along the y-axis of the vievvport. 
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e useCurrentVievv (readonly boolean) 


The initial vievv (i.e., before magnification and panning) of the current innermost SVG document fragment 
can be either the "standard" vievv (i.e., based on attributes on the “svg” element such as “vievvBox”) or to a 
"custom" vievv (i.e., a hyperlink into a particular “vievv” or other element - see Linking into SVG content: IRI 
fragments and SVG veievvs). If the initial vievv is the "standard" vievv, then this attribute is false. If the initial 
vievv is a "custom" vievv, then this attribute is true. 


e currentVievv (readonly SVGVievvSpec) 





"The definition of the initial vievv (i.e., before magnification and panning) of the current innermost SVG doc- 
ument fragment. The meaning depends on the situation: 


e If the initial vievv vvas a "standard" vievv, then: 

o the values for vievvBox, preserveAspectRatio and zoomAndPan vvithin currentVievv vvill match the 
values for the corresponding DOM attributes that are on SVGSVGElement directly 

o the values for transform and vievvTarget vvithin currentVievv vvill be null 

e If the initial vievv vvas a link into a “vievv” element, then: 

o the values for vievvBox, preserveAspectRatio and zoomAndPan vvithin currentVievv vvill corres- 
pond to the corresponding attributes for the given “vievr” element 

o the values for transform and vievvTarget vvithin currentVievv vvill be null 

e If the initial vievv vvas a İink into another element (i.e., other than a “vievv”), then: 

o the values for vievvBox, preserveAspectRatio and zoomAndPan vvithin currentVievv vvill match the 
values for the corresponding DOM attributes that are on SVGSVGElement direetly for the closest 
ancestor “svg” element 

o the values for transform vvithin currentVievv vvill be null 

o the vievvTarget vvithin currentVievv vvill represent the target of the link 

e Ifthe initial vievv vvas a link into the SVG document fragment using an SVG vievv specification fragment 
identifter (i.e., FsvgVievv(...)), then: 

o the values for vievvBox, preserveAspectRatio, zoomAndPan, transform and vievvTarget vvithin cur- 
rentVievv vvill correspond to the values from the SVG vievr specification fragment identifter 


"The obiect itself and its contents are both read only. 


e currentScale (float) 


On an outermost svg element, this attribute indicates the current scale factor relative to the initial vievv 
to take into account user magnification and panning operations, as described under Magnification and 
panning. DOM attributes currentScale and currentTranslate are equivalent to the 2x3 matrix labcdefl 


- İcurrentScale 0 0 currentScale currentTranslate.x currentTranslate.yl. If "magnification" is enabled (i.e., 
zoomAndPan-"magnify"), then the effect is as if an extra transformation vvere placed at the outermost level 
on the SVG document fragment (i.e., outside the outermost svg element). 

VVhen accessed on an “svg” element that is not an outermost svg element, it is undefined vvhat behavior this 
attribute has. 
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e currentTranslate (readonly SVGPoint) 


On an outermost svg element, the corresponding translation factor that takes into account user "magnifica- 
tion". 

VVhen accessed on an “svg” element that is not an outermost svg element, it is undefined vvhat behavior this 
attribute has. 





Operations: 


e unsigned long suspendRedravv(in unsigned long maxVvaitMilliseconds) 
Takes a time-out value vvhich indicates that redravv shall not occur until: 
1. the corresponding unsuspendRedravv() call has been made, 


2. an unsuspendRedravvAl1l1() call has been made, or 
3. its timer has timed out. 


mn environments that do not suppott interactivity (e.g., print media), then redravv shall not be suspended. 
Calls to suspendRedravv() and unsuspendRedravv() should, but need not be, made in balanced pairs. 

To suspend redravr actions as a collection of SVG DOM changes occur, precede the changes to the SVG 
DOM vrith a method call similar to: 


suspendHandleTD “ suspendRedrav (maxvaitMilliseconds), 


and follovv the changes vvith a method call similar to: 


unsuspendRedrav (suspendHandl1eTD), 


Note that multiple suspendRedravv calİs can be used at once and that each such method call is treated inde- 
pendently of the other suspendRedravv method calls. 


Parameters 
e unsigned long maxiizitMilliseconds 


The amount of time in milliseconds to hold off before redravving the device. Values greater than 60 


seconds vvill be truncated dovvn to 60 seconds. 
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Returns 
A number vvhich acts as a unique identifter for the given suspendRedravv() call. This value must be 
passed as the parameter to the corresponding unsuspendRedravv() method call, 


void unsuspendRedravv(in unsigned long suspendHandlelD) 


Cancels a specified suspendRedravv() by providing a unique suspend handile TD that vvas returned by a pre- 
vious suspendRedravv() call, 


Parameters 


e unsigned long suspendHandlelD 
A number vvhich acts as a unique identifter for the desired suspendRedravv() call, The number supplied 
must be a value returned from a previous call to suspendRedravv(). If an invalid handle TD value is 
provided then the request to unsuspendRedravv() is silently ignored. 


void unsuspendRedravvAll() 


Cancels all currently active suspendRedravv() method calls. This method is most useful at the very end of a 
set of SVG DOM calls to ensure that all pending suspendRedravv() method calls have been cancelled. 


void forceRedravv() 


In rendering environments supporting interactivity, forces the user agent to immediately redravv all regions 
of the vievvport that require updating. 


void pauseAnimationst() 


Suspends (i.e., pauses) all currently running animations that are defined vvithin the SVG document fragment 
corresponding to this “svg” element, causing the animation clock corresponding to this document fragment 


to stand still until it is unpaused. 


void unpauseAnimations() 


Unsuspends (i.e., unpauses) currently running animations that are defined vvithin the SVG document frag- 
ment, causing the animation clock to continue from the time at vvhich it vvas suspended. 


boolean animationsPaused() 
Returns true if this SVG document fragment is in a paused state. 


Returns 
Boolean indicating vvhether this SVG document fragment is in a paused state. 


e float getCurrentTime() 


Returns the current time in seconds relative to the start time for the current SVG document fragment. If 
getCurrentTime is called before the document timeline has begun (for example, by script running in a “seript” 
element before the document/s SVGLoad event is dispatched), then 0 is returned. 
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Returns 
The current time in seconds, or 0 if the document timeline has not yet begun. 


e void setCurrentTimetin float seconds) 


Adfusts the clock for this SVG document fragment, establishing a nevv current time. If setCurrentTime is 
called before the document timeline has begun (for example, by script running in a “seript” element before 
the document"s SVGLoad event is dispatched), then the value of seconds in the last invocation of the method 
gives the time that the document vvill seek to once the document timeline has begun. 





Parameters 


ə float seconds 
The nevv current time in seconds relative to the start time for the current SVG document fragment. 


e Nodelist getintersectionList(in SVGRect recf, in SVGElement referenceElement) 


Returns the list of graphics elements vvhose rendered content intersects the supplied rectangle. Each candid- 
ate graphics element is to be considered a match only if the same graphics element can be a target of pointer 


events as defined in "pointer-events” processing. 
Parameters 


ə SVGRect recf 
The test rectangle. The values are in the initial coordinate system for the current “svg” element. 


e SVGElement referenceElement 
If not null, then any intersected element that doesn"t have the referenceElement as ancestor must not 
be included in the returned Nodelist. 


Returns 
A İist of Elements vvhose content intersects the supplied rectangle. This NodeList must be implemented 
identically to the NodelList interface as defined in DOM Level 2 Core (İDOM2), section 1.2) vvith the 
exception that the interface is not live. 
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Nodelist getEncelosureList(in SVGRect recf, in SVGElement referenceElement) 


Returns the list of graphics elements vvhose rendered content is entirely contained vvithin the supplied rect- 
angle. Each candidate graphics element is to be considered a match only if the same graphics element can be 
a target of pointer events as defined in “pointer-events” processing. 


Parameters 


ə SVGRect recf 
"The test rectangle. The values are in the initial coordinate system for the current “svg” element. 


e SVGElement referenceElement 
If not null, then any intersected element that doesn" have the referenceElement as ancestor must not 
be included in the returned Nodelist. 


Returns 
A list of Elements vvhose content is enclosed by the supplied rectangle. This NodeList must be imple- 
mented identically to the NodelList interface as defined in DOM Level 2 Core (TDOM2), section 1.2) 
vvith the exception that the interface is not live. 


boolean checklntersection(in SVGElement element, in SVGRect recf) 


Returns true if the rendered content of the given element intersects the supplied rectangle. Each candidate 
graphics element is to be considered a match only if the same graphics element can be a target of pointer 
events as defined in "pointer-events” processing. 


Parameters 


ə SVGElement element 
The element on vvhich to perform the given test. 


ə SVGRect recf 
The test rectangle. The values are in the initial coordinate system for the current “svg” element. 


Returns 
True or false, depending on vvhether the given element intersects the supplied rectangle. 


boolean checkEnclosure(in SVGElement element, in SVGRect recf) 


Returns true if the rendered content of the given element is entirely contained vvithin the supplied rectangle. 
Each candidate graphics element is to be considered a match only if the same graphics element can be a tar- 
get of pointer events as defined in “pointer-events” processing. 
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Parameters 


e SVGElement element 
"The element on vvhich to perform the given test. 


ə SVGRect recf 
"The test rectangle. The values are in the initial coordinate system for the current “svg” element. 


Returns 
True or false, depending on vvhether the given element is enclosed by the supplied rectangle. 


void deselectAll() 


Unselects any selected obiects, including any selections of text strings and type-in bars. 


SVGNumber createSVGNumber() 
Creates an SVGNumber obiect outside of any document trees. The obiect is initialized to a value of zero. 


Returns 
An SVGNumber obiect. 


SVGLength createSVGLength() 


Creates an SVGLength obiect outside of any document trees. The obiect is initialized to the value of 0 user 


units. 


Returns 
An SVGLength obiect. 


SVGAngle ecreateSVGAngle() 


Creates an SVGAngle obiect outside of any document trees. The obiect is initialized to the value 0 degrees 
(unitless). 


Returns 
An SVGAngle obiect. 


SVGPoint createSVGPoint() 


Creates an SVGPoint obiect outside of any document trees. The obiect is initialized to the point (0,0) in the 
user coordinate system. 
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Returns 
An SVGPoint obiect. 


SVGMatrix createSVGMatrix() 
Creates an SVGMatrix obfect outside of any document trees. The obiect is initialized to the identity matrix. 


Returns 
An SVGMatrix obiect. 


SVGRect createSVGRect() 
Creates an SVGRect obiect outside of any document trees. The obiect is initialized such that all values are set 


to 0 user units. 


Returns 
An SVGRect obiect. 


SVGTransform createSVGTransform() 
Creates an SVGTransform obiect outside of any document trees. The obiect is initialized to an identity matrix 


transform (SVG TRANSFORM MATRIX). 


Returns 
An SVGTransform obiect. 


SVGTransform createSVGTransformFromMatrix(in SVGMatrix mafrix) 


Creates an SVGTransform obiect outside of any document trees. The obiect is initialized to the given matrix 
transform (i.e., SVG "TRANSFORM MATRIX). The values from the parameter mafrix are copied, the mafrix 
parameter is not adopted as SVGTransform::matrix. 


Parameters 


e SVGMatrix matrix 
The transform matrix. 


Returns 
An SVGTransform obiect. 


Element getElementByld(in DOMString elementld) 


Searches this SVG document fragment (i.e., the search is restricted to a subset of the document tree) for an 


Element vvhose id is given by elementld. If an Element is found, that Element is returned. If no such element 
exists, returns null. Behavior is not defined if more than one element has this id. 


Parameters 
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e DOMsString elementld 
The unique id value for an element. 


Returns 
The matching element. 


5.11.3 Interface SVGGElement 





The SVGSVGElement interface corresponds to the “g” element. 


interface SV6GElement : SVGElement, 
SV6Tests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVösStylable, 
SVGTransformable f 

x 


5.11.4 Interface SVGDefsElement 


The SVGDefsElement interface corresponds to the “defs” element. 


interface SVG6DefsElement : SVGElement, 
SV6GTests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVöStylable, 
SVGTransformable 1 

y 


5.11.5 Interface SVGDescElement 


The SVGDescElement interface corresponds to the “desc” element. 


interface SV6DescElement : SVGElement, 
SVGLangSpace, 
SVöstylable 1 
x 


5.11.6 Interface SVGTitleElement 


"The SVGTitleElement interface corresponds to the “title” element. 


interface SVGTitleElement : SVGElement, 
SVGLangSpace, 
SVöstylable £ 
x 
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5.11.7 Interface SVGSymbolElement 


The SVGSymbolElement interface corresponds to the “symbol” element. 


interface SV6SymbolElement : SVGElement, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVGStylable, 
SVGFitToVievBox (f 

x 





5.11.8 Interface SVGUseElement 


The SVGüÜseElement interface corresponds to the “use” element. 


interface SVGUseElement : SVGElement, 
SVGURTReference, 
SVGTests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVöStylable, 
SVGTransformable 1 
readonly attribute SVGAnimatedLength x, 
readonly attribute SVGAnimatedLength y, 
readonly attribute SVGAnimatedLength vidth, 
readonly attribute SVGAnimatedLength height, 
readonly attribute SVGElementInstance instanceRoot, 
readonly attribute SVGElementInstance animatedInstanceRoot, 
ik 


Attributes: 
e X (readonly SVGAnimatedLength) 


Corresponds to attribute “x” on the given “use” element. 


ey (readonly SVGAnimatedLength) 


Corresponds to attribute “y” on the given “use” element. 


e vvidth (readonly SVGAnimatedLength) 


Corresponds to attribute “vvidih” on the given “use” element. 


e height (readonly SVGAnimatedLength) 


Corresponds to attribute “height” on the given “use” element. 


e instanceRoot (readonly SVGElementinstance) 


"The root of the "instance tree", See description of SVGElementilnstance for a discussion on the instance tree. 
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e animatedinstanceRoot (readonly SVGElementlnstance) 


If the “xlink:href” attribute is being animated, contains the current animated root of the "instance tree". If the 
“xlink:href” attribute is not currently being animated, contains the same value as instanceRoot. See descrip- 
tion of SVGElementlnstance for a discussion on the instance tree. 


5.11.9 Interface SVGElementinstance 


For each “use” element, the SVG DOM maintains a shadovr tree (the "instance tree") of obiects of type SVGEle- 
mentİnstance. An SVGElementlİnstance represents a single node in the instance tree. The root obiect in the instance 
tree is pointed to by the instanceRoot attribute on the SVGÜseElement obfect for the corresponding “use” element. 

If the “use” element references a simple graphics element such as a “rect”, then there is only a single 
SVGElementİnstance obfect, and the correspondingElement attribute on this SVGElementinstance obiect is the 
SVGRectElement that corresponds to the referenced “rect” element. 





If the “use” element references a “g” vvhich contains tvvo “rect” elements, then the instance tree contains three 
SVGElementİnstance obfects, a root SVGElementinstance obfect vvhose correspondingElement is the SVGGEle- 
ment obiect for the “g/, and then tvvo child SVGElementinstance obiects, each of vvhich has its correspondingEle- 
ment that is an SVGRectElement obiect. 

If the referenced obiect is itself a “use”, or if there are “use” subelements vvithin the referenced obiect, the in- 
stance tree vvill contain recursive expansion of the indirect references to form a complete tree. For example, if a 
“use” element references a “g,, and the “g” itself contains a “use”, and that “use” references a “rect”, then the instance 
tree for the original (outermost) “use” vvill consist of a hierarchy of SVGElementinstance obiecis, as follovvs: 


SVGElementInstance 451 (parentNode-null, firstChild-/£2, correspondingElement is the "g") 
SVGElementInstance 22 (parentNodez/1, firstChilde-/£3, correspondingElement is the other "use") 
SVGElementInstance 273 (parentNodez£2, firstChildenull, correspondingElement is the "rect") 


interface SVGElementInstance : EventTarget ( 
readonly attribute SVGElement correspondingElement, 
readonly attribute SVGUseElement correspondingUseElement, 
readonly attribute SVGElementInstance parentNode, 
readonly attribute SVGElementInstanceList childNodes, 
readonly attribute SVGElementInstance firstChild, 
readonly attribute SVGElementInstance lastChild, 
readonly attribute SVGElementInstance previousSibling, 
readonly attribute SVGElementInstance nextSibling, 

ii 


Attributes: 


e correspondingElement (readonly SVGElement) 


"The corresponding element to vvhich this obfect is an instance. For example, if a “use” element references 
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a “rect” element, then an SVGElementlnstance is created, vvith its correspondingElement being the 
SVGRectElement obiect for the “rect” element. 


correspondingUseElement (readonly SVGUseElement) 


"The corresponding “use” element to vvhich this SVGElementinstance obfect belongs. VVhen “use” elements are 
nested (e.g., a “use” references another “use” vvhich references a graphics element such as a “rect”), then the 
correspondingÜseElement is the outermost “use” (i.e., the one vvhich indirectly references the “rect”, not the 
one vvith the direct reference). 


parentNode (readonly SVGElementlnstance) 


"The parent of this SVGElementinstance vvithin the instance tree. All SVGElementlnstance obiects have a par- 
ent except the SVGElementlnstance vvhich corresponds to the element vvhich vras directly referenced by the 
“use” element, in vvhich case parentNode is null. 


ehildNodes (readonly SVGElementlnstanceList) 


An SVGElementinstancelist that contains all children of this SVGElementinstance vvithin the instance tree. 
If there are no children, this is an SVGElementinstancelist containing no entries (i.e., an empty list). 


firstChild (readonly SVGElementlnstance) 


"The first child of this SVGElementlnstance vvithin the instance tree. If there is no such SVGElementinstance, 
this returns null. 


lastChild (readonly SVGElementlnstance) 


The last child of this SVGElementinstance vvithin the instance tree. If there is no such SVGElementinstance, 
this returns null. 


previousSibling (readonly SVGElementlnstance) 


The SVGElementİnstance immediately preceding this SVGElementinstance. If there is no such SVGEle- 
mentinstance, this returns null, 


nextSibling (readonly SVGElementlnstance) 


The SVGElementİnstance immediately follovring this SVGElementinstance. If there is no such SVGEle- 
mentiİnstance, this returns null, 
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5.11.10 Interface SVGElementlinstanceList 


The SVGElementlnstancelist interface provides the abstraction of an ordered collection of SVGElementinstance 
obfects, vvithout defining or constraining hovv this collection is implemented. 


interface SVGElementInstanceList ( 
readonly attribute unsigned long length, 


SVGElementinstance item(in unsigned long index), 


Aftributes: 


e length (readonly unsigned long) 


The number of SVGElementinstance obiects in the list. The range of valid child indices is 0 to length-1 in- 
clusive. 


Operations: 


e SVGElementlnstance item(in unsigned long index) 


Returns the indexth item in the collection. If index is greater than or equal to the number of nodes in the list, 


this returns null. 
Parameters 


e unsigned long index 
Index into the collection. 


Returns 
The SVGElementinstance obfect at the indexth position in the SVGElementinstancelist, or null if that 


is not a valid index. 


5.11.11 Interface SVGlmageElement 


The SVGlmageElement interface corresponds to the “image” element. 


interface SV6ImageElement : SVGElement, 
SVGURTReference, 
SVGTests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVöStylable, 
SVGTransformable 1 
readonly attribute SVGAnimatedLength x, 
readonly attribute SVGAnimatedLength y, 
readonly attribute SVGAnimatedLength vidth, 
readonly attribute SVGAnimatedLength height, 


readonly attribute SVGAnimatedPreserveAspectRatio preserveAspectRatio, 


Aftributes: 
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e x (readonly SVGAnimatedLength) 


Corresponds to attribute “x” on the given “image” element. 


y (readonly SVGAnimatedLength) 


Corresponds to attribute “y” on the given “image” element. 





e vvidth (readonly SVGAnimatedLength) 


Corresponds to attribute “vridth” on the given “image” element. 


e height (readonly SVGAnimatedLength) 


Corresponds to attribute “height” on the given “image” element. 


e preserveAspectRatio (readonly SVGAnimatedPreserveAspectRatio) 


Corresponds to attribute “preserveAspectRatio” on the given “image” element. 


5.11.12 Interface SVGSvvitchElement 


The SVGövvitchElement interface corresponds to the “svviteh” element. 


interface SV6GSuitchElement : SVGElement, 
SV6Tests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVöStylable, 
SVGTransformable 1 

x 


5.11.13 Interface GetSVGDocument 


"This interface provides access to an SVG document embedded by reference in another DOM:-based language. The 
expectation is that the interface is implemented on DOM obiects that allovv such SVG document references, such 
as the DOM Element obieet that corresponds to an HTML “obiect” element. Such DOM obiects are often also re- 
quired to implement the EmbeddingElement defined in the VVindovv specification İV/INDOVVİ. 

"This interface is deprecated and may be dropped from future versions of the SVG specification. Authors are 


suggested to use the contentDocument attribute on the EmbeddingElement interface to obtain a referenced SVG 
document, if that interface is available. 
interface GetSVGDocument 1 


SVGDocument getSVGDocument () , 
R 
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Operations: 


e SVGDocument getSVGDocument() 


"This method must return the Document obyect embedded content in an embedding element, or null if there 
is no document. 

Note that this is equivalent to fetching the value of the EmbeddingElement : :contentDocument attrib- 
ute of the embedding element, if the EmbeddingElement interface is also implemented. The author is advised 
to check that the document element of the returned Document is indeed an “svg” element instead of assum- 
ing that that vvill alvvays be the case. 





Returns 
The Document obiect for the referenced document, or null if there is no document. 
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4 Basic Data Types and lInterfaces 
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4.1 Syntax 


c 
.o 
5 
İv) 
m") 
(s 
(3) 
E 
E 
ə) 
(ə) 
o 
ad 
. 
s 


The EBNF grammar is as used in the XML specification, vvith the addition of -, a case-insensitive literal: 
characters in the ASCII range (only) are declared to be case-insensitive. For example, -"Hello" vvill match 
(Hih)tele)(IDMİL)(o1O). This makes the productions much easier to read. 





? optional, zero or one 
“ one or more 

al zero or more 

l alternation 

"string" literal 


e"string" case-insensitive literal 


ıl a character range 
IN excluded character range 
0 grouping 


4.2 Basic data types 


"his section defines a number of common data types used in the definitions of SVG properties and attributes. Some 
data types that are not referenced by multiple properties and attributes are defined inline in subsequent chapters. 

Note that, as noted belovv, the specification of some types is different for CSS property values in style sheets 
(in the “style” attribute, “style” element or an external style sheet) than it is for for XML attribute values (including 
presentation attributes). This is due to restrictions in the CSS grammar. For example, scientific notation is allovved 
in attributes, including presentation attributes, but not in style sheets. 


xangles - Angles are specifted in one of tvvo vvays depending upon vvhether they are used in CSS property syntax 
or SVG presentation attribute syntax: 


ə VVhen an -angles is used in a style sheet or vvith a property in a “style” attribute, the syntax must match the 
follovving pattern: 


angle ::z number (-"deg" 1 -"grad" 1 -"rad")? 


vvhere deg indicates degrees, grad indicates grads and rad indicates radians. The unit identifler may be in 
lovver (recommended) or upper case. 
For properties defined in CSS2 İCSS2l, an angle unit identifier must be provided (for non-zero values). 
For SVG-specific properties the angle unit identifter is optional. If a unit is not provided, the angle value is 
assumed to be in degrees. 
ə VVhen an -angles is used in an SVG presentation attribute, the syntax must match the follovving pattern: 
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angle ::z number ("deg" 1 "grad" 1 "rad")? 
The unit identifter, if present, must be in lovver case, if not present, the angle value is assumed to be in degrees. 
In the SVG DOM, -angles values are represented using SVGAngle or SVGAnimatedAngle obiects. 


xanything” : The basic type -canything” is a sequence of zero or more characters. Specifically: 


anything :: Char” 
vvhere Char is the production for a character, as defined in XML 1.0 (İXML10l, section 2.2). 


ecolorx - The basic type -color” is a CSS2 compatible specification for a color in the sRGB color space TSRGB). 
ecolor” applies to SVG"s use of the “color” property and is a component of the definitions of properties “fill”, “stroke”, 
“stop-color”, “flood-color” and “lighting-color”, vvhich also offer optional ICC-based color specifications. 

SVG supports all of the syntax alternatives for -color” defined in CS52 syntax and basic data types (TCSS2İ, 
section 4.3.6), vvith the exception that SVG allovvs an expanded list of recognized color keyvvords names. 

A ccolor: is either a keyvvord (see Recognized color keyvvord namers) or a numerical RGB specification. 

In addition to these color keyvvords, users may specify keyvvords that correspond to the colors used by obfects 
in the users environment. The normative definition of these keyvvords is found in User preferences for colors 
(İCSS2), section 18.2). 

The format of an RGB value in hexadecimal notation is a "2" immediately follovved by either three or six 
hexadecimal characters. The three-digit RGB notation (£rgb) is converted into six-digit form (£rrggbb) by replic- 
ating digits, not by adding zeros. For example, ifb0 expands to sffbbo0. This ensures that vvhite (Hfffff) can be spe- 
cifled vvith the short notation (/Hff) and removes any dependencies on the color depth of the display. The format 
of an RGB value in the functional notation is an RGB start-function follovved by a comma-separated list of three 
numerical values (either three integer values or three percentage values) follovved by ")". An RGB start-function is 
the case-insensitive string "rgb(", for example "RGB(" or "rGb(". For compatibility, the all-lovvercase form "rgb(" is 
preferred. The integer value 255 corresponds to 10077, and to F or FF in the hexadecimal notation: rgb(255,255,255) 
- rgb(10077, 10077, 10072) - “2FFF. VVhite space characters are allovved around the numerical values. AİlI RGB colors 
are specified in the sRGB color space İSRGBİ. Using sRGB provides an unambiguous and obiectively measurable 
definition of the color, vvhich can be related to international standards (see (FCOLORIMETRYİ). 


color 1:8 "S" hexdigit hexdigit hexdigit (hexdigit hexdigit hexdigit)? 

İ "rgb(" vsp” integer comma integer comma integer vsp” ")" 

İ "rgb(" vsp” integer "S" comma integer "S" comma integer "Ss" usp” ")" 
İ color-keyvord 

10-9A-Fa-f1 

vsp” "," vsp” 


hexdigit :: 
comma 


vvhere color-keyyvord matches (case insensitively) one of the color keyvvords listed in Recognized color keyvvord 
names belovv, or one of the system color keyvvords listed in User preferences for colors (TCSS2), section 18.2). 
"The corresponding SVG DOM interface definitions for -color? are defined in Document Obiect Model CSS, 


c 
.o 
5 
İv) 
m") 
(s 
(3) 
E 
E 
ə) 
(ə) 
o 
ad 
. 
s 





in particular, see RGBColor (İDOM2STYLEİ), section 2.2). SVG"s extension to color, including the ability to specify 
ICC-based colors, are represented using DOM interface SVGColor. 


ecoordinates - A -coordinates is a length in the user coordinate system that is the given distance from the origin 
of the user coordinate system along the relevant axis (the x-axis for X coordinates, the y-axis for Y coordinates). 
Its syntax is the same as that for -length”. 


coordinate ::z length 
VVithin the SVG DOM, a -coordinates is represented as an SVGLength or an SVGAnimatedLength. 


xİrequeney? - Frequeney values are used vvith aural properties. As defined in CSS2, a frequeney value is a -num- 
ber” immediately follovved by a frequeney unit identifter. The frequency unit identifters are: 


e Hz: Hertz 
e kHz: kilo Hertz 


Frequeney values may not be negative. 
In the SVG DOM, -frequeney? values are represented using the CSSPrimitiveValue interface defined in Docu- 
ment Obiect Model CSS (İDOM2STYLE), section 2.2). 


eFuncilRiI5 . Functional notation for an İRI: "url(" -IRI- ")", 


sicccolorsx - An -icecolors is an ICC color specification. In SVG 1.1, an ICC color specification is given by a name, 
vvhich references a “color-profile” element, and one or more color component values. The grammar is as follovvs: 


"icc-color(" name (comma-usp number)- ")" 
17, (02x202x9:/xD//xA1 /” any char except ",", "(", ")" or usp “/ 


icccolor :: 
name 


"The corresponding SVG DOM interface for -icecolor” is SVGICCColor. 


"." "" 


sinteger” - An -integer” is specifted as an optional sign character ("-4" or 
to "9": 


) follovved by one or more digits "0" 


integer ::z f4-1? 160-914 


If the sign character is not present, the number is non-negative. 

Unless stated othervvise for a particular attribute or property, the range for an -integer” encompasses (at a 
minimum) -2147483648 to 2147483647. 

VVithin the SVG DOM, an -integer” is represented as a long or an SVGAnimatedlnteger. 


€İRI- - An TInternationalized Resource Identifier (see IRİ). For the specification of TRI references in SVG, see IRI 
references. 


elengiths - A length is a distance measurement, given as a number along vvith a unit vvhich may be optional. 
Lengths are specifted in one of tvvo vvays depending upon vvhether they are used in CS5 property syntax or SVG 
presentation attribute syntax: 


e  VVhen a -length” is used in a style sheet or vvith a property in a “style” attribute, the syntax must match the 
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follovving pattern: 


Tength 1: number (-"em" l -"ex" l -"px" l -"in" l -"cm" l -"mm" l -"pt" l -"pc")? 


See the CSS2 specification for the meanings of the unit identifters. The unit identifler may be in lovver (re- 
commended) or upper case. 

For properties defined in CSS2 İCSS2), a length unit identifler must be provided (for non-zero values). 
For SVG-specific properties, the length unit identifter is optional. If a unit is not provided, the length value 





represents a distance in the current user coordinate system. 
ə VVhen a -lengths is used in an SVG presentation attribute, the syntax must match the follovving pattern: 


length ::z number ("em" 1 "ex" / "px" 1 "in" 1 "cn" 1 "mn" 1 "pt" 1 "pc" 1 "sSs")? 
The unit identifter, if present, must be in İovver case, if not present, the length value represents a distance in 
the current user coordinate system. 

Note that the non-property -length: definition also allovvs a percentage unit identifter. The meaning of 
a percentage length value depends on the attribute for vvhich the percentage length value has been specifted. 
Tavo common cases are: (a) vvhen a percentage length value represents a percentage of the vievvport vvidth or 
height (refer to the section that discusses units in general), and (b) vvhen a percentage length value represents 
a percentage of the bounding box vvidth or height on a given obiect (refer to the section that describes obyect 


bounding box units). 
In the SVG DOM, -length: values are represented using SVGLength or SVGAnimatedLength obiects. 


elist-of-family-namess. - A -list-of-family-namess is a list of font family names using the same syntax as the 
“font-family” property, excluding the -generic-family” and "inherit" values. 


elist-of-stringss - A -list-of-stringss consists of a separated sequence of -string”s. String lists are vvhite space- 
separated, vvhere vvhite space is defined as one or more of the follovving consecutive characters: "space" (U--0020), 
"tab" (U--0009), "line feed" (U--000A) and "carriage return" (U--000D). 

The follovving is an EBNF grammar describing the -list-of-strings” syntax: 


list-of-strings ::z string 

İ string usp list-of-strings 
string x I”//x9:FxAfFxDöFx2017 
vSp z İFx9/FxAfFxDEx201-4 


elist-of-Tss - (VVhere T is a type other than -string” and -family-names.) A list consists of a separated sequence 
of values. Unless explicitly described differently, lists vvithin SVG"s XML attributes can be either comma-separated, 
vvith optional vvhite space before or after the comma, or vvhite space-separated. 
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VVhite space in lists is defined as one or more of the follovving consecutive characters: "space" (U--0020), "tab" 
(U--0009), "line feed" (U--000A), "carriage return" (U--000D) and "form-feed" (U--000C). 
The follovving is a template for an EBNF grammar describing the -list-of-Ts- syntax: 


list-of-TS ::-T 

İ T comma-vsp list-of-Ts 
comma -v/sp z (uSpr ","? usp”) 1 ("," vsp”) 
v/Sp z- (/x20 1 £x9 1 ZxD İ FxA) 


VVithin the SVG DOM, values of a -list-of-Tss type are represented by an interface specific for the particular 
type T. For example, a -list-of-lengthss is represented in the SVG DOM using an SVGLengthList or SVGAnim- 
atedLengthlList obfect. 
enames - A name, vvhich is a string vvhere a fevv characters of syntactic significance are disallovved. 

name ::z (7, ( )/2x204Fx92FxDEFXxA1 /” any char except ",", "(", ")" or vsp “/ 
enumber” - Real numbers are specifted in one of tvvo vvays. VVhen used in a style sheet, a -number: is defined as 
follovvs: 


number ::z integer 
Iİ 18-1? 10-91“ "." 10-91: 


"This syntax is the same as the definition in CSS (İCSS2)l, section 4.3.1). 
VVhen used in an SVG attribute, a -number: is defined differently, to allovv numbers vvith large magnitudes 
to be specified more concisely: 


number ::z integer (İEel integer)? 
I 18-1? 10-91“ "." (0-91- (İEel integer)? 


VVithin the SVG DOM, a -number: is represented as a float, SVGNumber or a SVGAnimatedNumber. 


enumber-optional-number?” - A pair of -numberss, vvhere the second -number: is optional. 


number-optional-number ::z number 
İ number comma-v/sp number 


In the SVG DOM, a -number-optional-number” is represented using a pair of SVGAnimatedinteger or SVGAnim- 
atedNumber obiects. 


epaint? - The values for properties “fil” and “stroke” are specifications of the type of paint to use vvhen filling or 
stroking a given graphics element. The available options and syntax for -paint” are described in Specifying paint. 
VVithin the SVG DOM, -paints values are represented using SVGPaint obiects. 


epercentages - Percentages are specifted as a number follovved by a "Z" character: 


percentage ::- number "s" 
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Note that the definition of -number” depends on vvhether the percentage is specifted in a style sheet or in an at- 
tribute that is not also a presentation attribute. 

Percentage values are alvvays relative to another value, for example a length. Fach attribute or property that 
allovvs percentages also defines the reference distance measurement to vvhich the percentage refers. 

VVithin the SVG DOM, a -percentages is represented using an SVGNumber or SVGAnimatedNumber obiect. 


etimes - A time value is a -number” immediately follovved by a time unit identifter. The time unit identifters are: 


e ms: milliseconds 
e s: seconds 


m the SVG DOM, -times values are represented using the CSSPrimitiveValue interface defined in Document Ob- 
fect Model CSS (İDOM2STYLE), section 2.2). 


etransform-list- - A -transform-list” is used to specify a list of coordinate system transformations. A detailed 
description of the possible values for a -transform-list- is given in Modifying the User Coordinate System: the 
transform attribute. 

VVithin the SVG DOM, a -transform-list” value is represented using an SVGTransformList or SVGAnim- 
atedTransformlList obiect. 


e€XML-Names - An XML name, as defined by the Name production in Exfensible Markup Language (XML) 10 
(EXML10), section 2.3). 


4.3 Real number precision 


Unless stated othervvise for a particular attribute or property, a -number” has the capacity for at least a single- 
precision floating point number and has a range (at a minimum) of -3.4e-38F to 43.464-38F. 
It is recommended that higher precision floating point storage and computation be performed on operations 
such as coordinate system transformations to provide the best possible precision and to prevent round-off errors. 
Conforming High-Quality SVG Vievvers are required to use at least double-precision floating point for inter- 
mediate calculations on certain numerical operations. 


4.4 Recognized color keyvvord names 


"The follovving is the list of recognized color keyvvords that can be used as a keyvvord value for data type -colors: 
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L1 aliceblue 
L1 antiquevvhite 
Ll aqua 

L1 aquamarine 
L1 azure 

L1 beige 

P3 bisque 

İ black 

L1 blanchedalmond 
İ İblue 

El blueviolet 
L1 brovvn 

Ll burlİyvvood 
mi cadetblue 
L1 chartreuse 


mi chocolate 

Ll coral 

ii cornflovverblue 
L1 cornsilk 

L1 crimson 

Ll cyan 

İ İdarkblue 

L1 darkcyan 

E1 darkgoldenrod 
Ll darkgray 

izi darkgreen 

L1 darkgrey 

İ ldarkkhaki 

Ll darkmagenta 
L1 darkolivegreen 
L1 darkorange 
L1 darkorchid 
Lİ darkred 

L1 darksalmon 
L1 darkseagreen 
L1 darkslateblue 


rgb(240, 248, 255) 
rgb(250, 235, 215) 
rgb( 0, 255, 255) 
rgb(127, 255, 212) 
rgb(240, 255, 255) 
rgb(245, 245, 220) 
rgb(255, 228, 196) 
rgb( 0, 0, 0) 
rgb(255, 235, 205) 
rgb( 0, 0, 255) 
rgb(138, 43, 226) 
rgb(165, 42, 42) 
rgb(222, 184, 135) 
rgb( 95, 158, 160) 
rgb(127, 255, 0) 
rgb(210, 105, 30) 
rgb(255, 127, 80) 
rgb(100, 149, 237) 
rgb(255, 248, 220) 
rgb(220, 20, 60) 
rgb( 0, 255, 255) 
rgb( 0, 0, 139) 
rgb( 0, 139, 139) 
rgb(184, 134, 11) 
rgb(169, 169, 169) 
rgb( 0, 100, 0) 
rgb(169, 169, 169) 
rgb(189, 183, 107) 
rgb(139, 0, 139) 
rgb( 85, 107, 47) 
rgb(255, 140, 0) 
rgb(153, 50, 204) 
rgb(139, 0, 0) 
rgb(233, 150, 122) 
rgb(143, 188, 143) 
rgb( 72, 61, 139) 


L1 lightpink 

L1 lightsalmon 
L1 lightseagreen 
L İlightskyblue 
EZ lightslategray 
L1 lightslategrey 
Fİ lightsteelblue 
L İlightyellovv 
Lil lime 

iH İimegreen 
iH linen 

L1 magenta 

LI maroon 


L1 mediumaquamarine 


izl mediumblue 

L1 mediumorchid 
L1 mediumpurple 
ili mediumseagreen 
L1 mediumslateblue 


rgb(255, 182, 193) 
rgb(255, 160, 122) 
rgb( 32, 178, 170) 
rgb(135, 206, 250) 
rgb(119, 136, 153) 
rgb(119, 136, 153) 
rgb(176, 196, 222) 
rgb(255, 255, 224) 
rgb( 0, 255, 0) 
rgb( 50, 205, 50) 
rgb(250, 240, 230) 
rgb(255, 0, 255) 
rgb(128, 0, 0) 
rgb(102, 205, 170) 
rgb( 0, 0, 205) 
rgb(186, 85, 211) 
rgb(147, 112, 219) 
rgb( 60, 179, 113) 
rgb(123, 104, 238) 


İL İmediumspringgreen rgb( 0, 250, 154) 


LI mediumturquoise 


L1 mediumvioletred 
L1 midnightblue 


L1 mintcream 
İİ) mistyrose 
El moccasin 
iH navaiovvhite 
bl navy 

El oldlace 

E olive 

L1 olivedrab 
El orange 

L1 orangered 
L1 orchid 

L1 palegoldenrod 


L1 palegreen 


rgb( 72, 209, 204) 
rgb(199, 21, 133) 
rgb( 25, 25, 112) 
rgb(245, 255, 250) 
rgb(255, 228, 225) 
rgb(255, 228, 181) 
rgb(255, 222, 173) 
rgb( 0, 0, 128) 
rgb(253, 245, 230) 
rgb(128, 128, 0) 
rgb(107, 142, 35) 
rgb(255, 165, 0) 
rgb(255, 69, 0) 
rgb(218, 112, 214) 
rgb(238, 232, 170) 
rgb(152, 251, 152) 


c 
.o 
5 
İv) 
m") 
cc 
(3) 
E 
E 
ə) 
(ə) 
o 
ad 
. 
s 





L1 darkslategray 
L1 darkslategrey 
Ll darkturquoise 
m darkviolet 
L1 deeppink 

L1 deepskyblue 
iH dimgray 

L1 dimgrey 

L1 dodgerblue 

İ İfrebrick 

İ İroralvhite 

İ İrorestgreen 
Llluchsia 

b gainsboro 
L1 ghostuvhite 
E1 gold 

Ll goldenrod 
L.İgray 

Lİgrey 

E1 green 

Lİ greenyellovv 
L1 honeydevv 
m hotpink 

LE indianred 

Lİ indigo 

EI ivory 

İ İknaki 

L1 lavender 


Ll lavenderblush 


L1 lavvngreen 
L1 lemonchiffon 
İ llightblue 

Lİ lightcoral 
L1 lightcyan 


rgb( 47, 79, 79) 
rgb( 47, 79, 79) 
rgb( 0, 206, 209) 
rgb(148, 0, 211) 
rgb(255, 20, 147) 
rgb( 0, 191, 255) 
rgb(105, 105, 105) 
rgb(105, 105, 105) 
rgb( 30, 144, 255) 
rgb(178, 34, 34) 
rgb(255, 250, 240) 
rgb( 34, 139, 34) 
rgb(255, 0, 255) 
rgb(220, 220, 220) 
rgb(248, 248, 255) 
rgb(255, 215, 0) 
rgb(218, 165, 32) 
rgb(128, 128, 128) 
rgb(128, 128, 128) 
rgb( 0, 128, 0) 
rgb(173, 255, 47) 
rgb(240, 255, 240) 
rgb(255, 105, 180) 
rgb(205, 92, 92) 
rgb( 75, 0, 130) 
rgb(255, 255, 240) 
rgb(240, 230, 140) 
rgb(230, 230, 250) 
rgb(255, 240, 245) 
rgb(124, 252, 0) 
rgb(255, 250, 205) 
rgb(173, 216, 230) 
rgb(240, 128, 128) 
rgb(224, 255, 255) 


L1 lightgoldenrodyellovv rgb(250, 250, 210) 


L1 lighigray 


rgb(211, 211, 211) 


bl paleturquoise 
L1 palevioletred 
L1 papayavvhip 
L1 peachpuff 
L1 peru 

L1 pink 

LI plum 

L1 povvderblue 
bl purple 

L1 red 

iH rosybrovn 
L1 royalblue 
Lil saddlebrovn 
L1 salmon 

L1 sandybrovvn 
L1 seagreen 
L1 seashell 
pl sienna 

L1 silver 

İL İskyblue 

LI slateblue 
L1 slategray 
ill slategrey 
L1 snovv 

L1 springgreen 
L1 steelblue 
L1 tan 

L1 teal 
Lİmiste 

Lİ tomato 

L1 turquoise 
L1 violet 

M vvheat 

bl vvhite 

L1 vvhitesmoke 


Llyellov 


rgb(175, 238, 238) 
rgb(219, 112, 147) 
rgb(255, 239, 213) 
rgb(255, 218, 185) 
rgb(205, 133, 63) 
rgb(255, 192, 203) 
rgb(221, 160, 221) 
rgb(176, 224, 230) 
rgb(128, 0, 128) 
rgb(255, 0, 0) 
rgb(188, 143, 143) 
rgb( 65, 105, 225) 
rgb(139, 69, 19) 
rgb(250, 128, 114) 
rgb(244, 164, 96) 
rgb( 46, 139, 87) 
rgb(255, 245, 238) 
rgb(160, 82, 45) 
rgb(192, 192, 192) 
rgb(135, 206, 235) 
rgb(106, 90, 205) 
rgb(112, 128, 144) 
rgb(112, 128, 144) 
rgb(255, 250, 250) 
rgb( 0, 255, 127) 
rgb( 70, 130, 180) 
rgb(210, 180, 140) 
rgb( 0, 128, 128) 
rgb(216, 191, 216) 
rgb(255, 99, 71) 
rgb( 64, 224, 208) 
rgb(238, 130, 238) 
rgb(245, 222, 179) 
rgb(255, 255, 255) 
rgb(245, 245, 245) 
rgb(255, 255, 0) 


Lliihigreen rgb(144, 238, 144) Lİyellovgreen rgb(154, 205, 50) 
Ellighigrey rgb(211, 211, 211) 
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4.5 Basic DOM interfaces 


4.5.1 Interface SVGElement 


Al ofthe SVG DOM interfaces that correspond directly to elements in the SVG language (such as the SVGPathEle- 
ment interface for the “path” element) derive from the SVGElement interface. 


interface SVGElement : Element 1 
attribute DOMString id setraises(DOMException) , 
attribute DOMString xmlbase setraises (DÜMException), 
readonly attribute SVGSVGElement ovnerSVGElement , 
readonly attribute SVGElement vievportElement, 
y 





Aftributes: 


e id (DOMString) 


"The value of the “id” attribute on the given element, or the empty string if “id” is not present. 


Exceptions on setting 


e DOMException, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


xmlbase (DOMString) 


Corresponds to attribute “xml:base” on the given element. 


Exceptions on setting 


e DOMException, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


ov/nerSVGElement (readonly SVGSVGElement) 


The nearest ancestor “svg” element. Null if the given element is the outermost svg element. 
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e vievvportElement (readonly SVGElement) 


"The element vvhich established the current vievvport. Often, the nearest ancestor “svg” element. Null if the 


given element is the outermost svg element. 


4.5.2 Interface SVGAnimatedBoolean 


Used for attributes of type boolean vvhich can be animated. 


interface SVGAnimatedBoolean ( 

attribute boolean baseVal setraises(DOMException), 
readonly attribute boolean animVal, 
y 


Aftributes: 


e baseVal (boolean) 


The base value of the given attribute before applying any animations. 


Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e animVal (readonly boolean) 


If the given attribute or property is being animated, contains the current animated value of the attribute 
or property. İf the given attribute or property is not currently being animated, contains the same value as 
baseVal. 


4.5.3 Interface SVGAnimatedString 


Used for attributes of type DOMString vvhich can be animated. 


interface SVGAnimatedString ( 

attribute DOMString baseVal setraises (DÜMException), 
readonly attribute DOMString animVal, 
n 


Aftributes: 


e baseVal (DOMString) 


"The base value of the given attribute before applying any animations. 


c 
.o 
5 
İv) 
m") 
(s 
(3) 
E 
E 
ə) 
(ə) 
o 
cc 
. 
s 





Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e animVal (readonly DOMString) 


If the given attribute or property is being animated, contains the current animated value of the attribute 
or property. İf the given attribute or property is not currently being animated, contains the same value as 
baseVal. 


4.5.4 Interface SVGSitringList 


"This interface defines a list of DOMString values. 
SVGStringList has the same attributes and methods as other SVGxxxlList interfaces. Implementers may con- 
sider using a single base class to implement the various SVGxxxList interfaces. 


interface SV6StringList ( 
readonly attribute unsigned 1ong numberOfTtems, 
void clear() raises(DOüMException), 
DOMString initialize(in DOMString nevltem) raises (DOMException), 
DOMString getItem(in unsigned long index) raises(DOMException) , 
DOMString insertItemBefore(in DOMString nevltem, in unsigned long index) raises(DOüMException), 
DOMString replaceltem(in DOMString nevİItem, in unsigned long index) raises(DOMException), 
DOMString removeltem(in unsigned long index) raises(D0MException) , 


DOMString appendItem(in DOMString nevltem) raises (DOMException), 
y 


Aftributes: 


e numberOfltems (readonly unsigned long) 


The number of items in the list. 
Operations: 


e void clear() 


Clears all existing current items from the list, vvith the result being an empty list. 
Exceptions 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list cannot be modifted. 


e DOMString initializein DOMString nevvltem) 


Clears all existing current items from the list and re-initializes the list to hold the single item specified by 
the parameter. 
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Parameters 


ə DOMString nevvltem 
"The item vvhich should become the only member of the list. 


Returns 
"The item being inserted into the list. 


Exceptions 





e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list cannot be modifted. 


e DOMString getltem(in unsigned long index) 
Returns the specifted item from the list. 
Parameters 


ə unsigned long index 
The index of the item from the list vvhich is to be returned. The first item is number 0. 


Returns 
"The selected item. 


Exceptions 


e DOMEvxception, code INDEX SIZE ERR 
Raised if the index number is greater than or equal to numberOfltems. 


DOMsString insertltemBefore(in DOMString nevvltem, in unsigned long index) 


Imserts a nevv item into the list at the specifted position. The first item is number 0. 
Parameters 


ə DOMString nevvltem 
The item vvhich is to be inserted into the list. 


e unsigned long index 
"The index of the item before vvhich the nevv item is to be inserted. The first item is number 0. If the 
index is equal to 0, then the nevr item is inserted at the front of the list. If the index is greater than or 
equal to numberOfltems, then the nevv item is appended to the end of the list. 
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Returns 
"The inserted item. 


Exceptions 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list cannot be modifted. 





e DOMString replaceltem(in DOMString nevvltem, in unsigned long index) 


Replaces an existing item in the list vvith a nevv item. 
Parameters 


ə DOMString nevvltem 
"The item vvhich is to be inserted into the list. 


e unsigned long index 
"The index of the item vvhich is to be replaced. The first item is number 0. 


Returns 
"The inserted item. 


Exceptions 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list cannot be modifted. 


e DOMEvxception, code INDEX SIZE ERR 
Raised if the index number is greater than or equal to numberOfltems. 


e DOMString removeltemün unsigned long index) 
Removes an existing item from the list. 
Parameters 


e unsigned long index 
"The index of the item vvhich is to be removed. The first item is number 0. 


Returns 
The removed item. 


Exceptions 


c 
.Ə 
5 
İv) 
m") 
(s 
(3) 
E 
E 
(ə) 
(ə) 
o 
ad 
. 
s 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list cannot be modifted. 


e DOMEvxception, code INDEX SIZE ERR 
Raised if the index number is greater than or equal to numberOfltems. 


e DOMString appendltem(in DOMString nevvltem) 


TInserts a nevv item at the end of the list. 





Parameters 


ə DOMString nevvltem 
The item vvhich is to be inserted. The first item is number 0. 


Returns 
"The inserted item. 


Exceptions 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list cannot be modifted. 


4.5.5 Interface SVGAnimatedEnumeration 


Used for attributes vvhose value must be a constant from a particular enumeration and vvhich can be animated. 


interface SVGAnimatedEnumeration 1 
attribute unsigned short baseVal setraises (DOMException) , 
readonly attribute unsigned short animVal, 


Attributes: 


e baseVal (unsigned short) 


"The base value of the given attribute before applying any animations. 
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Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e animVal (readoniy unsigned short) 


If the given attribute or property is being animated, contains the current animated value of the attribute 
or property. İf the given attribute or property is not currently being animated, contains the same value as 
baseVal. 


4.5.6 Interface SVGAnimatedinteger 


Used for attributes of basic type -integer” vvhich can be animated. 


interface SVGAnimatedInteger 4 
attribute long baseVal setraises(DOMException) , 
readonly attribute long animVal, 


Attributes: 


e baseVal (long) 


"The base value of the given attribute before applying any animations. 


Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e animVal (readoniy long) 


If the given attribute or property is being animated, contains the current animated value of the attribute 
or property. İf the given attribute or property is not currently being animated, contains the same value as 
baseVal. 


4.5.7 Interface SVGNumber 


Used for attributes of basic type -number”. 


interface SVGNumber ( 
attribute float value setraises(DOüMException), 
Y 


Aftributes: 


e value (float) 


"The value of the given attribute. 
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Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


4.5.8 Interface SVGAnimatedNumber 





Used for attributes of basic type -numbers vvhich can be animated. 


interface SVGAnimatedNumber ( 

attribute float baseVal setraises (DÜUMException) , 
readonly attribute float animVal, 
ik 


Aftributes: 


e baseVal (float) 


"The base value of the given attribute before applying any animations. 


Exceptions on setting 


e DOMEvxception, code NO MODIHFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e animVal (readonly float) 


If the given attribute or property is being animated, contains the current animated value of the attribute 
or property. İf the given attribute or property is not currently being animated, contains the same value as 
baseVal. 


4.5.9 Interface SVGNumberlist 


This interface defines a list of SVGNumber obiects. 

SVGNumberlist has the same attributes and methods as other SVGxxxlist interfaces. İImplementers may 
consider using a single base class to implement the various SVGxxxList interfaces. 

An SVGNumberlist obiect can be designated as read only, vvhich means that attempts to modify the obfect 
vvill result in an exception being throvvn, as described belovv. 
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interface SVGNumberList ( 


H 


readonly attribute unsigned 1ong numberOfTtems, 


void clear() raises(DÜMException) , 

SVGNumber initialize(in SVGNumber nevltem) raises (DOMException) , 

SVGNumber getTtem(in unsigned long index) raises (DOÜMException) , 

SVGNumber insertItemBefore(in SVGNumber nev/ltem, in unsigned long index) raises(D0MException), 
SVGNumber replaceTtem(in SVGNumber nevTtem, in unsigned long index) raises(D0MException) , 
SVGNumber removeltem(in unsigned long index) raises(DüMException), 

SVGNumber appendItem(in SVGNumber nevTItem) raises (DOMException) , 


Attributes: 


e numberOfltems (readonly unsigned long) 


The number of items in the list. 


Operations: 


e void clear() 


Clears all existing current items from the list, vvith the result being an empty list. 
Exceptions 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list corresponds to a read only attribute or vvhen the obiect itself is read only. 


e SVGNumber initializetin SVGNumber nevvltem) 


Clears all existing current items from the list and re-initializes the list to hold the single item specifted by 
the parameter. If the inserted item is already in a list, it is removed from its previous list before it is inserted 
into this list. The inserted item is the item itself and not a copy. 


Parameters 


ə SVGNumber nevvifem 
The item vvhich should become the only member of the list. 


Returns 
"The item being inserted into the list. 


Exceptions 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list corresponds to a read only attribute or vvhen the obiect itself is read only. 
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e SVGNumber getltemiin unsigned long index) 


Returns the specifted item from the list. The returned item is the item itself and not a copy. Any changes 
made to the item are immediately reflected in the list. 


Parameters 


e unsigned long index 
The index of the item from the list vvhich is to be returned. The first item is number 0. 


Returns 
"The selected item. 


Exceptions 


e DOMEvxception, code INDEX SIZE ERR 
Raised if the index number is greater than or equal to numberOfltems. 


SVGNumber insertitemBefore(in SVGNumber nevvİtem, in unsigned long index) 


mserts a nevv item into the list at the specifted position. The first item is number 0. If nevvlfem is already in 
a list, it is removed from its previous list before it is inserted into this list. The inserted item is the item itself 
and not a copy. If the item is already in this list, note that the index of the item to insert before is before the 


removal of the item. 
Parameters 


e SVGNumber nevvltem 
The item vvhich is to be inserted into the list. 


e unsigned long index 
The index of the item before vvhich the nevv item is to be inserted. "The first item is number 0. If the 
index is equal to 0, then the nevv item is inserted at the front of the list. If the index is greater than or 
equal to numberOfltems, then the nevv item is appended to the end of the list. 


Returns 
"The inserted item. 


Exceptions 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list corresponds to a read only attribute or vvhen the obiect itself is read only. 
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e SVGNumber replaceltem(in SVGNumber nevvİtem, in unsigned long index) 


Replaces an existing item in the list vvith a nevv item. If nevvltem is already in a list, it is removed from its 
previous list before it is inserted into this list. The inserted item is the item itself and not a copy. If the item 
is already in this list, note that the index of the item to replace is before the removal of the item. 


Parameters 


e SVGNumber nevvltem 
The item vvhich is to be inserted into the list. 


e unsigned long index 
"The index of the item vvhich is to be replaced. The first item is number 0. 


Returns 
"The inserted item. 


Exceptions 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list corresponds to a read only attribute or vvhen the obiect itself is read only. 


e DOMEvxception, code INDEX SIZE ERR 


Raised if the index number is greater than or equal to numberOfltems. 


e SVGNumber removeltemüin unsigned long index) 


Removes an existing item from the list. 
Parameters 


e unsigned long index 
The index of the item vvhich is to be removed. The first item is number 0. 


Returns 
The removed item. 


Exceptions 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list cannot be modifted. 


e DOMEvxception, code INDEX SIZE ERR 
Raised if the index number is greater than or equal to numberOfltems. 
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e SVGNumber appendfitem(in SVGNumber nevvltem) 


mserts a nevv item at the end of the list. If nevvİtem is already in a İist, it is removed from its previous list 
before it is inserted into this list. The inserted item is the item itself and not a copy. 


Parameters 


e SVGNumber nevvltem 
The item vvhich is to be inserted. The first item is number 0. 


Returns 
"The inserted item. 


Exceptions 


e DOMEvxception, code NO MODIHFICATION ALLOVVED ERR 
Raised vvhen the list cannot be modifted. 


4.5.10 Interface SVGAnimatedNumberlist 


Used for attributes vvhich take a list of numbers and vvhich can be animated. 


interface SVGAnimatedNumberList ( 
readonly attribute SVGNumberList baseVal, 
readonly attribute SV6GNumberList animVal, 


Afttributes: 


e baseVal (readonly SVGNumberlist) 


"The base value of the given attribute before applying any animations. 


e animVal (readonly SVGNumberlist) 
A read only SVGNumberlist representing the current animated value of the given attribute. If the given at- 
tribute is not currently being animated, then the SVGNumberlist vvill have the same contents as baseVal. 
"The obiect referenced by animVal vvill alvrays be distinct from the one referenced by baseVal, even vvhen the 


attribute is not animated. 


4.5.11 Interface SVGLength 


The SVGLength interface corresponds to the -lengths basic data type. 
An SVGLength obiect can be designated as read only, vvhich means that attempts to modify the obiect vvill 
result in an exception being throvvn, as described belovv. 
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interface SV6Length (f 


// Length Unit Types 
const unsigned short SVG LENGTHTYPE UNKNOMN — 0, 
const unsigned short SVG LENGTHTYPE NUMBER 1, 
const unsigned short SVG LENGTHTYPE PERCENTAGE £ 2, 
const unsigned short SVG LENGTHTYPE EMS z 3, 

const unsigned short SVG LENGTHTYPE EXS 4, 

const unsigned short SVG LENGTHTYPE PX 
const unsigned short SVG LENGTHTYPE CM 
const unsigned short SVG LENGTHTYPE MM 
const unsigned short SVG LENGTHTYPE IN 
const unsigned short SVG LENGTHTYPE PT 
const unsigned short SVG LENGTHTYPE PC 


readonly attribute unsigned short unitType, 
attribute float value setraises(DÜüMException), 
attribute float valuelnSpecifiedUnits setraises(DÜMException), 
attribute DOMString valueAsString setraises(DOMException) , 


void nevValueSpecifiedUnits(in unsigned short unitType, in float valuelnSpecifiedUnits) raises (DOMException), 
void convertToSpecifiedUnits(in unsigned short unitType) raises(D0MException), 


Constants in group “Length Unit Types”: 


e SVG LENGTHTYPE UNKNOVVN (unsigned short) 


The unit type is not one of predefined unit types. İt is invalid to attempt to define a nevv value of this type or 
to attempt to svvitch an existing value to this type. 


e SVG LENGTHTYPE NUMBER (nsigned short) 


No unit type vvas provided (i.e., a unitless value vvas specifted), vvhich indicates a value in user units. 


e SVG LENGTHTYPE PERCENTAGE (nsigned short) 


A percentage value vvas specifted. 


e SVG LENGTHTYPE EMS (unsigned short) 


A value vvas specifed using the em units defined in CSS2. 


e SVG LENGTHTYPE EFXS (unsigned short) 


A value vvas specifted using the ex units defined in CSS2. 


e SVG LENGTHTYPE PX (unsigned short) 


A value vvas specifted using the px units defined in CSS2. 


SVG. LENGTHTYPE CM (unsigned short) 


A value vvas specifted using the cm units defined in CSS2. 


SVG LENGTHTYPE MM (unsigned short) 
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A value vvas specifted using the mm units defined in CSS2. 


SVG. LENGTHTYPE IN (unsigned short) 


A value vvas specifted using the in units defined in CSS2. 


SVG. LENGTHTYPE PT (unsigned short) 





A value vvas specifted using the pt units defined in CSS2. 


SVG LENGTHTYPE PC (unsigned short) 


A value vvas specifted using the pc units defined in CSS2. 
Attributes: 


e unitType (readonly unsigned short) 
"The type of the value as specified by one of the SVG LENGTHTYTE “ constants defined on this interface. 


e value (float) 


"The value as a floating point value, in user units. Setting this attribute vvill cause valuelnSpecifiedUnits and 
valueAsString to be updated automatically to reflect this setting. 


Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the length corresponds to a read only attribute or vvhen the obiect itself is read only. 


e valuelnSpecifitedUnits (float) 


"The value as a floating point value, in the units expressed by unitType. Setting this attribute vvill cause value 
and valueAs8String to be updated automatically to reflect this setting. 


Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the length corresponds to a read only attribute or vvhen the obiect itself is read only. 
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e valueAsString (DOMString) 


"The value as a string value, in the units expressed by unitType. Setting this attribute vvill cause value, 
valuelnSpecifiedUnits and unitType to be updated automatically to reflect this setting. 


Exceptions on setting 


ə DOMException, code SYNTAX ERR 
Raised if the assigned string cannot be parsed as a valid -lengths. 





e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the length corresponds to a read only attribute or vvhen the obiect itself is read only. 


Operations: 


e void nevvValueSpecifiedUnits(in unsigned short unifType, in float va/uelnSpecifiedUnits) 


Reset the value as a number vvith an associated unitType, thereby replacing the values for all of the attributes 
on the obiect. 


Parameters 


e unsigned short unifType 
"The unit type for the value (e.g., SVG LENGTHTYPE MM). 


e float valuelnSpecifiedUnits 
"The nevv value. 


Exceptions 


e DOMException, code NOT SUPPORTED ERR 
Raised if unitType is SVG LENGTHTYPE UNKNOVVN or not a valid unit type constant (one of the 
other SVG LENGTHTYPE “ constants defined on this interface). 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the length corresponds to a read only attribute or vvhen the obiect itself is read only. 
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e void convertToSpeciftedUnits(in unsigned short unifType) 


Preserve the same underlying stored value, but reset the stored unit identifter to the given unifType. Obfect 
attributes unitType, valuelnSpecifiedUnits and valueAsString might be modifted as a result of this method. 
For example, if the original value vvere "0.5em" and the method vvas invoked to convert to millimeters, then 
the unitType vvould be changed to SVG LENGTHTYPE MM, valuelnSpecifiedUnits vvould be changed to 
the numeric value 5 and valueAs8String vvould be changed to "5mm". 


Parameters 


e unsigned short unifType 
"The unit type to svvitch to (e.g., SVG. LENGTHTYPE MM). 


Exceptions 


e DOMException, code NOT. SUPPORTED ERR 
Raised if unitType is SVG LENGTHTYPE UNKNOVVN or not a valid unit type constant (one of the 
other SVG LENGTHTYPE “ constants defined on this interface). 


e DOMException, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the length corresponds to a read only attribute or vvhen the obiect itself is read only. 


4.5.12 Interface SVGAnimatedLength 


Used for attributes of basic type -lengths vvhich can be animated. 


interface SVGAnimatedLength ( 

readonly attribute SVGLength baseVal, 
readonly attribute SVGLength animVal, 
y 


Aftributes: 


e baseVal (readonly SVGLength) 


"The base value of the given attribute before applying any animations. 


e animVal (readonly SVGLength) 


A read only SVGLength representing the current animated value of the given attribute. If the given attribute 
is not currently being animated, then the SVGLength vvill have the same contents as baseVal. The obiect ref- 
erenced by animVal vvill alvrays be distinct from the one referenced by baseVal, even vvhen the attribute is 


not animated. 
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4.5.13 Interface SVGLengthlList 


This interface defines a list of SVGLength obiects. 

SVGLengthlist has the same attributes and methods as other SVOxxxList interfaces. Implementers may con- 
sider using a single base class to implement the various SVGxxxList interfaces. 

An SVGLengihlist obiect can be designated as read only, vvhich means that attempts to modify the obfect 
vvill result in an exception being throvvn, as described belovv. 


interface SVGLengthList ( 
readonly attribute unsigned 1ong numberOfTtems, 


void clear() raises(DÜMException), 
SVGLength initialize(in SVGLength nevltem) raises(DOMException) , 
SVGLength getTtem(in unsigned long index) raises (DOÜMException) , 
SVGLength insertIltemBefore(in SVGLength nevTItem, in unsigned long index) raises(DOMException) , 
SVGLength replaceTtem(in SVGLength nevItem, in unsigned long index) raises(D0MException) , 
SVGLength removeltem(in unsigned long index) raises(DüMException), 
SVGLength appendItem(in SVGLength nevlItem) raises(DOMException) , 
y 


Aftributes: 


e numberOfltems (readonly unsigned long) 


The number of items in the list. 
Operations: 


e void clear() 


Clears all existing current items from the list, vvith the result being an empty list. 


Exceptions 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list corresponds to a read only attribute or vvhen the obiect itself is read only. 


e SVGLength initialize(in SVGLength nevvltem) 


Clears all existing current items from the list and re-initializes the list to hold the single item specifted by 
the parameter. If the inserted item is already in a list, it is removed from its previous list before it is inserted 
into this list. The inserted item is the item itself and not a copy. 


Parameters 


ə SVGLength nevvltem 
The item vrhich should become the only member of the list. 
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Returns 
"The item being inserted into the list. 


Exceptions 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list corresponds to a read only attribute or vvhen the obiect itself is read only. 


SVGLength getltemi(in unsigned long index) 


Returns the specifted item from the list. The returned item is the item itself and not a copy. Any changes 
made to the item are immediately reflected in the list. 


Parameters 


e unsigned long index 
The index of the item from the list vvhich is to be returned. The first item is number 0. 


Returns 
"The selected item. 


Exceptions 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list corresponds to a read only attribute or vvhen the obiect itself is read only. 


SVGLength insertİtemBefore(in SVGLength nevvltem, in unsigned long index) 


mserts a nevv item into the list at the specifted position. The first item is number 0. If nevvlfem is already in 
a list, it is removed from its previous list before it is inserted into this list. The inserted item is the item itself 
and not a copy. If the item is already in this list, note that the index of the item to insert before is before the 
removal of the item. 


Parameters 


ə SVGLength nevvltem 
The item vvhich is to be inserted into the list. 


e unsigned long index 
The index of the item before vvhich the nevv item is to be inserted. "The first item is number 0. If the 
index is equal to 0, then the nevv item is inserted at the front of the list. If the index is greater than or 
equal to numberOfltems, then the nevv item is appended to the end of the list. 


Returns 
"The inserted item. 


Exceptions 
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e DOMException, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list corresponds to a read only attribute or vvhen the obiect itself is read only. 


e SVGLength replaceltem(in SVGLength nevvltem, in unsigned long index) 


Replaces an existing item in the list vvith a nevv item. If nevvltem is already in a list, it is removed from its 
previous list before it is inserted into this list. The inserted item is the item itself and not a copy. If the item 
is already in this list, note that the index of the item to replace is before the removal of the item. 





Parameters 


ə SVGLength nevvltem 
The item vvhich is to be inserted into the list. 


e unsigned long index 
"The index of the item vvhich is to be replaced. The first item is number 0. 


Returns 
"The inserted item. 


Exceptions 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list corresponds to a read only attribute or vvhen the obiect itself is read only. 


e DOMEvxception, code INDEX SIZE ERR 
Raised if the index number is greater than or equal to numberOfltems. 


e SVGLength removeltemtin unsigned long index) 
Removes an existing item from the list. 
Parameters 


e unsigned long index 
The index of the item vvhich is to be removed. The first item is number 0. 


Returns 
The removed item. 


Exceptions 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list corresponds to a read only attribute or vvhen the obiect itself is read only. 
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e DOMEvxception, code INDEX SIZE ERR 
Raised if the index number is greater than or equal to numberOfltems. 


ə SVGLength appendfitem(in SVGLength nevvltem) 


mserts a nevv item at the end of the list. If nevvİtem is already in a İist, it is removed from its previous list 
before it is inserted into this list. The inserted item is the item itself and not a copy. 





Parameters 


ə SVGLength nevvltem 
"The item vvhich is to be inserted. The first item is number 0. 


Returns 
"The inserted item. 


Exceptions 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list corresponds to a read only attribute or vvhen the obiect itself is read only. 


4.5.14 Interface SVGAnimatedLengthlList 


Used for attributes of type SVGLengthlist vvhich can be animated. 


interface SVGAnimatedLengthList ( 
readonly attribute SVGLengthList baseVal, 
readonly attribute SVGLengthList animVal, 


Aftributes: 


e baseVal (readonly SVGLengthList) 


"The base value of the given attribute before applying any animations. 


e animVal (readonly SVGLengihlist) 


A read only SVGLengihlist representing the current animated value of the given attribute. If the given at- 
tribute is not currently being animated, then the SVGLengthlist vvill have the same contents as baseVal, The 


obiect referenced by animVal vvill alvrays be distinct from the one referenced by baseVal, even vvhen the at- 
tribute is not animated. 


4.5.15 Interface SVGAngle 
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The SVGAngle interface corresponds to the -angles basic data type. 
An SVGAngle obiect can be designated as read only, vvhich means that attempts to modify the obiect vvill 
result in an exception being throvvn, as described belovv. 


interface SVGAngle 1 


// Angle Unit Types 

const unsigned short SVG ANGLETYPE UNKNOMN 0, 
const unsigned short SVG ANGLETYPE UNSPECTFTED £ 1, 
const unsigned short SVG ANGLETYPE DEG £ 2, 





const unsigned short SVG ANGLETYPE RAD Sip 
const unsigned short SVG ANGLETYPE GRAD z 4, 


readonly attribute unsigned short unitType, 
attribute float value setraises(DÜüMException) , 
attribute float valuelnSpecifiedUnits setraises(D0MException), 
attribute DOMString valueAsString setraises(DOüMException) , 


void nevValueSpecifiedUnits(in unsigned short unitType, in float valuelnSpecifiedUnits) raises (DOMException), 
void convertToSpecifiedUnits(in unsigned short unitType) raises(DOMException) , 


yx 


Constants in group “Angle Unit Types”: 


e SVG ANGLETYPE UNKNOVVN (nsigned short) 


The unit type is not one of predefined unit types. İt is invalid to attempt to define a nevv value of this type or 
to attempt to svvitch an existing value to this type. 


e SVG ANGLETYPE UNSPECIFTED (unsigned short) 


No unit type vvas provided (i.e., a unitless value vvas specifted). For angles, a unitless value is treated the 
same as if degrees vvere specifted. 


e SVG ANGLETYPE DEG (unsigned short) 


"The unit type vvas explicitly set to degrees. 


e SVG ANGLETYPE RAD (ınsigned short) 


The unit type is radians. 


e SVG ANGLETYPE GRAD (nsigned short) 


"The unit type is radians. 


Aftributes: 


e unitType (readonly unsigned short) 
The type of the value as specifled by one of the SVG ANGLETYPE “ constants defined on this interface. 
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e value (float) 


The angle value as a floating point value, in degrees. Setting this attribute vvill cause valuelnSpecifiedUnits 
and valueAs8tring to be updated automatically to reflect this setting. 


Exceptions on setting 





e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the angle corresponds to a read only attribute or vvhen the obiect itself is read only. 


valuelnSpecifiedUnits (float) 


"The angle value as a floating point value, in the units expressed by unitType. Setting this attribute vvill cause 
value and valueAsString to be updated automatically to reflect this setting. 


Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the angle corresponds to a read only attribute or vvhen the obiect itself is read only. 


valueAsString (DOMString) 


"The angle value as a string value, in the units expressed by unitType. Setting this attribute vvill cause value, 
valuelnSpeciftedUnits and unitType to be updated automatically to reflect this setting. 


Exceptions on setting 


ə DOMException, code SYNTAX ERR 
Raised if the assigned string cannot be parsed as a valid -angle”. 


e DOMException, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the angle corresponds to a read only attribute or vvhen the obiect itself is read only. 


Operations: 


e void nevvValueSpecifiedUnits(in unsigned short unifType, in float valuelnSpecifiedUnits) 


Reset the value as a number vvith an associated unitType, thereby replacing the values for all of the attributes 
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on the obiect. 
Parameters 


e unsigned short unifType 
"The unit type for the value (e.g., SVG ANGLETYPE DEG). 


e float valuelnSpecifiedUnits 
"The angle value. 





Exceptions 


e DOMEvxception, code NOT. SUPPORTED ERR 
Raised if unitType is SVG ANGLETYPE UNKNOVVN or not a valid unit type constant (one of the 
other SVG ANGLETYPE “ constants defined on this interface). 


e DOMEvxception, code NO MODIHFICATION ALLOVVED ERR 


Raised vvhen the angle corresponds to a read only attribute or vvhen the obiect itself is read only. 


e void convertToSpeciftedUnits(in unsigned short unifType) 


Preserve the same underlying stored value, but reset the stored unit identifter to the given unifType. Obfect 
attributes unitType, valuelnSpecifiedUnits and valueAsString might be modifted as a result of this method. 


Parameters 


e unsigned short unifType 
"The unit type to svvitch to (e.g., SVG. ANGLETYPE DEG). 


Exceptions 


e DOMEvxception, code NOT. SUPPORTED ERR 
Raised if unitType is SVG ANGLETYPE UNKNOVVN or not a valid unit type constant (one of the 
other SVG ANGLETYPE “ constants defined on this interface). 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the angle corresponds to a read only attribute or vvhen the obiect itself is read only. 
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4.5.16 Interface SVGAnimatedAngle 


Used for attributes of basic data type -angles that can be animated. 


interface SVGAnimatedAngle ( 
readonly attribute SVGAngle baseVal, 
readonly attribute SVGAngle animVal, 


Aftributes: 


e baseVal (readonly SVGAngle) 


"The base value of the given attribute before applying any animations. 


e animVal (readonly SVGAngle) 


A read only SVGAngle representing the current animated value of the given attribute. If the given attribute 
is not currently being animated, then the SVGAngle vvill have the same contents as baseVal. The obiect ref- 
erenced by animVal vvill alvvays be distinct from the one referenced by baseVal, even vvhen the attribute is 
not animated. 


4.5.17 Interface SVGColor 


The SVGColər interface corresponds to color value definition for properties “stop-color”, “flood-color” and “lighting- 
color” and is a base class for interface SVGPaint. It incorporates SVG"s extended notion of color, vvhich incorporates 
ICC-based color specifications. 

mterface SVGColor does nof correspond to the -color? basic data type. For the -colors basic data type, 
the applicable DOM interfaces are defined in DOM Level 2 Style, in particular, see the RGBColor interface 
(İDOM2STYLE), section 2.2). 

Note: The SVGColor interface is deprecated, and may be dropped from future versions of the SVG specifica- 
tion. 


interface SVGColor : CSSValue 1 


// Color Types 

const unsigned short SVG COLORTYPE UNKNOMN — 0, 

const unsigned short SVG COLORTYPE RGBCOLOR 1, 

const unsigned short SVG COLORTYPE RGBCOLOR TCCCOLOR £ 2, 
const unsigned short SVG COLORTYPE CURRENTCOLOR 3, 


readonly attribute unsigned short colorType, 
readonly attribute RGBColor rgbColor, 
readonly attribute SVGICCColor iccColor, 


void setRGBColor(in DOMString rgbColor) raises(SVGException) , 

void setRGBColorICCColor(in DOMString rgbColor, in DÜMString iccColor) raises(SVGException) , 

void setColor(in unsigned short colorType, in DOMString rgbColor, in DÜMString iccColor) raises(SVGException), 
R 
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Constants in group “Color Types”: 


e SVG COLORTYPE UNKNOVVN (unsigned short) 


"The color type is not one of predefined types. İt is invalid to attempt to define a nevr value of this type or to 
attempt to svvitch an existing value to this type. 


e SVG COLORTYPE RGBCOLOR (unsigned short) 


An sRGB color has been specifted vvithout an alternative ICC color specification. 


e SVG COLORTYPE RGBCOLOR ICCCOLOR (unsigned short) 


An sRGB color has been specifted along vvith an alternative ICC color specification. 
e SVG COLORTYPE CURRENTCOLOR (unsigned short) 
Corresponds to vvhen keyvvord currentColor has been specifted. 
Attributes: 
e colorType (readonly unsigned short) 


The type of the value as specifled by one of the SVG COLORTYPE “ constants defined on this interface. 


e rgbColor (readonly RGBColor) 


"The color specified in the sRGB color space. 
e iccColor (readonly SVGICCColor) 
The alternate ICC color specification. 
Operations: 


e void setRGBColor(in DOMString rgbColor) 


Modifles the color value to be the specified sRGB color vvithout an alternate ICC color specification. 


Parameters 


ə DOMString rgbColor 
A string that matches -color”, vvhich speciftes the nevv sRGB color value. 


Exceptions 


e SVGException, code SVG INVALID VALUE ERR 
Raised if rgbColor does not match -colors. 
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e void setRGBColorICCColor(in DOMString rgbColor, in DOMString iceColor) 


Modifles the color value to be the specified sRGB color vvith an alternate ICC color specification. 
Parameters 


e DOMString rgbColor 
A string that matches -color”, vvhich speciftes the nevv sRGB color value. 





e DOMString iceColor 
A string that matches -icccolor”, vrhich speciftes the alternate ICC color specification. 


Exceptions 


ə SVGException, code SVG INVALID VALUE ERR 
Raised if rgbColor does not match -colors or if iceColor does not match -icecolors. 


e void setColor(in unsigned short colorType, in DOMString rgbColor, in DOMString iceColor) 


Sets the color value as specified by the parameters. If colorType requires an RGBColor, then rgöColor must 
be a string that matches -color”: othervvise, rgbColor. must be null, If colorType requires an SVGICCColor, 
then iceColor must be a string that matches -icccolor”: othervvise, iccColor must be null, 


Parameters 


e unsigned short colorType 
One of the defined constants for colorType. 


e DOMString rgbColor 
"The specification of an sRGB color, or null, 


e DOMString iceColor 
"The specification of an ICC color, or null, 


Exceptions 


e SVGException, code SVG TINVALID VALUE ERR 
Raised if one of the parameters has an invalid value. 
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4.5.18 Interface SVGICCColor 


The SVGICCColor interface expresses an ICC-based color specification. 
Note: The SVGICCColor interface is deprecated, and may be dropped from future versions of the SVG spe- 
cification. 


interface SVGICCColor ( 
attribute DOMString colorProfile setraises (DOMException) , 
readonly attribute SVGNumberList colors, 


Attributes: 


e colorProfile (DOMString) 


"The name of the color profile, vvhich is the first parameter of an ICC color specification. 


Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e colors (readonly SVGNumberlist) 


"The list of color values that define this TCC color. Fach color value is an arbitrary floating point number. 


4.5.19 Interface SVGRect 


Represents rectangular geometry. Rectangles are defined as consisting of a (x,y) coordinate pair identifying a min- 
imum X value, a minimum Y value, and a vvidth and height, vvhich are usually constrained to be non-negative. 

An SVGRect obiect can be designated as read only, vvhich means that attempts to modify the obiect vvill result 
in an exception being throvvn, as described belovv. 


interface SVGRect 1f 
attribute float x setraises(DÜMException), 
attribute float y setraises(DÜMException), 
attribute float vidth setraises(DOüMException), 
attribute float height setraises(DOMException) , 
y 


Aftributes: 


e X (float) 


"The x coordinate of the rectangle, in user units. 


c 
.o 
5 
İv) 
m") 
ss 
(3) 
z 
E 
ə) 
(ə) 
(3) 
ad 
. 
s 





Exceptions on setting 
e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 


Raised vvhen the rectangle corresponds to a read only attribute or vvhen the obiect itself is read only. 


e y (float) 


The y coordinate of the rectangle, in user units. 
Exceptions on setting 
e DOMException, code NO MODIFICATION ALLOVVED ERR 


Raised vvhen the rectangle corresponds to a read only attribute or vvhen the obiect itself is read only. 


e vvidth (float) 


"The vvidih coordinate of the rectangle, in user units. 
Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the rectangle corresponds to a read only attribute or vvhen the obiect itself is read only. 


e height (float) 


"The height coordinate of the rectangle, in user units. 
Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the rectangle corresponds to a read only attribute or vvhen the obiect itself is read only. 


4.5.20 Interface SVGAnimatedRect 


Used for attributes of type SVGRecet vvhich can be animated. 


interface SVGAnimatedRect 14 

readonly attribute SVGRect baseVal, 
readonly attribute SV6GRect animVal, 
y 


Aftributes: 


e baseVal (readonly SVGRect) 


The base value of the given attribute before applying any animations. 
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e animVal (readonly SVGRect) 


A read only SVGRect representing the current animated value of the given attribute. If the given attribute is 
not currently being animated, then the SVGRect vvill have the same contents as baseVal. The obiect referen- 
ced by animVal vvill alvvays be distinct from the one referenced by baseVal, even vvhen the attribute is not 


animated. 





4.5.21 Interface SVGünitTypes 


The SVGünitTypes interface defines a commonly used set of constants and is a base interface used by SVGGradi- 
entElement, SVGPatternElement, SVGClipPathElement, SVGMaskElement and SVGFilterElement. 


interface SVGUnitTypes ( 

// Unit Types 

const unsigned short SVG UNIT TYPE UNKNOMN - 0, 

const unsigned short SVG UNIT TYPE USERSPACEONUSE £ 1, 
const unsigned short SVG UNIT TYPE OB2ECTBOUNDINGBOX £ 2, 
R 


Constanis in group “Unit Types”: 


e SVG UNIT TYPE UNKNOVVN (unsigned short) 


"The type is not one of predefined types. İt is invalid to attempt to define a nevv value of this type or to attempt 
to svvitch an existing value to this type. 


e SVG UNIT TYPE USERSPACEONUSE (nsigned short) 


Corresponds to value "userSpaceOnUser, 


e SVG UNIT TYPE OB/ECTBOUNDINGBOX (unsigned short) 


Corresponds to value "obiectBoundingBox". 


4.5.22 Interface SVGSiylable 


The SVGötylable interface is implemented on all obfects corresponding to SVG elements that can have “style”, 
“class” and presentation attributes specifted on them. İt is thus an ancestor interface for many of the interfaces 


defined in this specification. 


interface SV6Stylable 1 


readonly attribute SVGAnimatedString className, 
readonly attribute CSSStyleDeclaration style, 


CSSValue getPresentationAttribute(in DOMString name), 
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Aftributes: 


e className (readonly SVGAnimatedString) 


Corresponds to attribute “class” on the given element. 


e style (readonly CSSStyleDeclaration) 





Corresponds to attribute “style” on the given element. If the user agent does not support styling vvith CSS, 
then this attribute must alvvays have the value of null. 


Operations: 


e CSSValue getPresentationAttribute(in DOMString name) 


Returns the base (i.e., static) value of a given presentation attribute as an obfect of type CSSValue. The 
returned obiect is live, changes to the obfects represent immediate changes to the obfects to vvhich the 


CSSValue is attached. 
Note: The getPresentationAttribute method is deprecated, and may be dropped from future versions of 


the SVG specification. 
Parameters 


e DOMString name 
The name of the presentation attribute vvhose value is to be returned. 


Returns 
The static/base value of the given presentation attribute as a CSSValue, or null if the given attribute 


does not have a specifted value. 


4.5.23 Interface SVGLocatable 


Imterface SVGLocatable is for all elements vvhich either have a “transform” attribute or don"t have a “ransform” at- 


tribute but vvhose content can have a bounding box in current user space. 


interface SVGLocatable f 


readonly attribute SVGElement nearestVievportElement, 
readonly attribute SVGElement farthestVievportElement, 


SVGRect getBBox(), 

SVöMatrix getCTM(), 

SVGMatrix getScreenCTM() , 

SVGMatrix getTransformToElement(in SVGElement element) raises(SVGException) , 
y 
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Aftributes: 


e nearestVievvportElement (readonly SVGElement) 


"The element vvhich established the current vievvport. Often, the nearest ancestor “svg” element. Null if the 
current element is the outermost svg element. 


e farthestVievvportElement (readonly SVGElement) 





"The farthest ancestor “svg” element. Null if the current element is the outermost svg element. 
Operations: 


e SVGRect getBBox£() 


Returns the tight bounding box in current user space (i.e., after application of the “transform” attribute, if 
any) on the geometry of all contained graphics elements, exclusive of stroking, clipping, masking and filter 
effects). Note that getBBox must return the actual bounding box at the time the method vvas called, even in 
case the element has not yet been rendered. 


Returns 
An SVGRect obiect that defines the bounding box. 


e SVGMatrix getCTMÜ 


Returns the transformation matrix from current user units (i.e., after application of the “transform” attribute, 
if any) to the vievvport coordinate system for the nearestVievvportElement. 


Returns 
An SVGMatrix obiect that defines the CTM. 


e SVGMatrix getSecreenCTM() 


Returns the transformation matrix from current user units (i.e., after application of the “transform” attribute, 
if any) to the parent user agent"s notice of a "pixel". For display devices, ideally this represents a physical 
screen pixel, For other devices or environments vvhere physical pixel sizes are not knovvn, then an algorithm 
similar to the CSS2 definition of a "pixel" can be used instead. Note that null is returned if this element is not 


hooked into the document tree. This method vvould have been more aptly named as getClientCTM, but the 
name getScreenCTM is kept for historical reasons. 


Returns 
An SVGMatrix obiect that defines the given transformation matrix. 
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e SVGMatrix getTransformToElement(in SVGElement element) 


Returns the transformation matrix from the user coordinate system on the current element (after application 
of the “transform” attribute, if any) to the user coordinate system on parameter element (after application of 


its “transform” attribute, if any). 


Parameters 





ə SVGElement element 
The target element. 


Returns 
An SVGMatrix obiect that defines the transformation. 


Exceptions 


e SVGException, code SVG MATRIX NOT INVERTABLE 
Raised if the currently defined transformation matrices make it impossible to compute the given matrix 
(e.g., because one of the transformations is singular). 


4.5.24 Interface SVGTransformable 


mterface SVGTransformable contains properties and methods that apply to all elements vvhich have attribute 


“transform”. 


interface SV6Transformable : SVGLocatable £ 
readonly attribute SVGAnimatedTransformList transform, 
y 


Aftributes: 


e transform (readonly SVGAnimatedTransformList) 


Corresponds to attribute “transform” on the given element. 


4.5.25 Interface SVGTests 


Interface SVGTests defines an interface vvhich applies to all elements vvhich have attributes “requiredFeatures”, “re- 


quiredExtensions” and “systemLanguage”. 
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interface SV6Tests ( 
readonly attribute SVGStringList requiredFeatures, 
readonly attribute SVGStringList requiredExtensions, 
readonly attribute SVGStringList systemLanguage , 


boolean hasExtension(in DOMString extension), 
R 


Attributes: 





e requiredFeatures (readonly SVGStringlist) 


Corresponds to attribute “requiredFeatures” on the given element. 


e requiredExtensions (readonly SVGStringlist) 


Corresponds to attribute “requiredExtensions” on the given element. 
e systemLanguage (readonly SVGStringlist) 
Corresponds to attribute “systemLanguage” on the given element. 
Operations: 


e boolean hasExtension(in DOMString exfension) 


Returns true if the user agent supports the given extension, specifted by a URL 
Parameters 


e DOMString extension 
"The name of the extension, expressed as a URL 


Returns 
True or false, depending on vvhether the given extension is supported. 


4.5.26 Interface SVGLangSpace 


mterface SVGLangSpace defines an interface vvhich applies to all elements vvhich have attributes “xml:lang” and 


. , 
xml:space”. 
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interface SVGLangSpace £ 
attribute DOMString xmllang setraises(DOMException) , 
attribute DOMString xmlspace setraises (D0MException) , 


Aftributes: 


e xmllang (DOMsSiring) 


Corresponds to attribute “xml:lang” on the given element. 


Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e xmİspace (DOMString) 


Corresponds to attribute “xml:space” on the given element. 


Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


4.5.27 Interface SVGExternalResourcesRequired 


Interface SVGExternalResourcesRequired defines an interface vvhich applies to all elements vvhere this element or 
one of its descendants can reference an external resource. 


interface SVGExternalResourcesRequired 1 
readonly attribute SVGAnimatedBoolean externalResourcesRequired, 


yx 


Attributes: 


e externalResourcesRequired (readonly SVGAnimatedBoolean) 


Corresponds to attribute “externalResourcesRequired” on the given element. Note that the SVG DOM defines 
the attribute “externalResourcesRequired” as being of type SVGAnimatedBoolean, vvhereas the SVG language 
definition says that “externalResourcesRequired” is not animated. Because the SVG language definition states 
that “externalResourcesRequired” cannot be animated, the animVal vvill alvvays be the same as the baseVal. 
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4.5.28 Interface SVGFitToVievvBox 


Interface SVGFitToVievvBox defines DOM attributes that apply to elements vvhich have XML attributes “vievvBox” 


and "preserveAspectRatio”. 


interface SV6FitToVieuBox 4 
readonly attribute SVGAnimatedRect vievBox, 
readonly attribute SVGAnimatedPreserveAspectRatio preserveAspectRatio, 


Attributes: 
e vievvBox (readonly SVGAnimatedRecet) 


Corresponds to attribute “vievvBox” on the given element. 


" preserveAspectRatio (readoniy SVGAnimatedPreserveAspectRatio) 


Corresponds to attribute “preserveAspectRatio” on the given element. 


4.5.29 Interface SVGZoomAndPan 


The SVGZoomAndPan interface defines attribute zoomAndPan and associated constants. 


interface SV6ZoomAndPan (f 


// Zoom and Pan Types 


const unsigned short SVG Z00MANDPAN UNKNOUN — 0, 
const unsigned short SVG Z00MANDPAN DISABLE 1, 
const unsigned short SVG Z00MANDPAN MAGNTFY 2, 


attribute unsigned short zoomAndPan setraises (DOMException) , 
y 


Constants in group “Zoom and Pan Types”: 


e SVG ZOOMANDPAN UNKNOVVN (nsigned short) 


"The enumeration vvas set to a value that is not one of predefined types. İt is invalid to attempt to define a 
nevv value of this type or to attempt to svvitch an existing value to this type. 


e SVG ZOOMANDPAN DiSABLE (nsigned short) 


Corresponds to value "disable". 


e SVG ZOOMANDPAN MAGNİFY (tnsigned short) 


Corresponds to value "magnify". 


Aftributes: 


e zoomAndPan (unsigned short) 


Corresponds to attribute “zoomAndPan” on the given element. The value must be one of the 
SVG ZOOMANDPAN “ constants defined on this interface. 
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Exceptions on setting 


e DOMException, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


4.5.30 Interface SVGVievvSpec 





"The interface corresponds to an SVG Vievv Specification. 


interface SV6GVieuvSpec : SVGZoomAndPan, 
SVGFitToVievBox 
readonly attribute SVGTransformList transform, 
readonly attribute SVGElement vievTarget, 
readonly attribute DÜOMString vievBoxString, 
readonly attribute DOMString preserveAspectRatioString, 
readonly attribute DOMString transformString, 
readonly attribute DOMString vievTargetString, 
y 


Aftributes: 


transform (readonly SVGTransformList) 


Corresponds to the transform setting on the SVG Vievv Specification. 


vievvTarget (readonly SVGElement) 


Corresponds to the vievvTarget setting on the SVG Vievv Specification. 


e vievvBoxString (readonly DOMString) 


Corresponds to the vievvBox setting on the SVG Vievv Specification. 


preserveAspectRatioString (readonly DOMString) 


Corresponds to the preserveAspectRatio setting on the SVG Vievv Specification. 


transformString (readonly DOMString) 


Corresponds to the transform setting on the SVG Vievv Specification. 
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e vievv TargetString (readonly DOMString) 


Corresponds to the vievvTarget setting on the SVG Vievv Specification. 


4.5.31 Interface SVGURIReference 


Imterface SVGURİReference defines an interface vvhich applies to all elements vvhich have the collection of XLink 
attributes, such as “xlinkhref”, vvhich define a URI reference. 


interface SVGURTReference 1 
readonly attribute SVGAnimatedString href, 
y 


Attributes: 


e href (readonly SVGAnimatedString) 


Corresponds to attribute “xlink:href” on the given element. 


4.5.32 Interface SVGCSSRule 


SVG extends interface CSSRule vvith interface SVGCSSRule by adding an SVGColorProfileRule rule to allovv for 
specification of ICC-based color. 
İt is likely that this extension vvill become part of a future version of CSS and DOM. 


interface SVGCSSRule : CSSRUle ( 
const unsigned short COLOR PROFTLE RULE £ 7, 


, 


Constants: 


e COLOR PROFHILE RULE (unsigned short) 


The rule is an (öcolor-profile. 


4.5.33 Interface SVGRenderingintent 


The SVGRenderingintent interface defines the enumerated list of possible values for “rendering-intent” attributes 
or descriptors. 


interface SV6Renderingintent ( 
// Rendering TIntent Types 
const unsigned short RENDERING INTENT UNKNOMN c 6, 
const unsigned short RENDERING INTENT AUTO — 1, 
const unsigned short RENDERING INTENT PERCEPTUAL c 2, 
const unsigned short RENDERING INTENT RELATIVE COLORIMETRIC 


- 3: 
const unsigned short RENDERING INTENT SATURATION c 4, 
const unsigned short RENDERING INTENT ABSOLUTE COLORTMETRİC c 5, 


H 


Constants in group “Rendering Intent Types”: 


RENDERING INTENT UNKNOVVN (unsigned short) 


"The type is not one of predefined types. İt is invalid to attempt to define a nevv value of this type or to attempt 
to svvitch an existing value to this type. 
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RENDERING INTENT AUTO (unsigned short) 


Corresponds to a value of "auto". 


RENDERING INTENT PERCEPTUAL (unsigned short) 


Corresponds to a value of "perceptual", 





RENDERING INTENT RELATIVE COLORIMETRİC (unsigned short) 


Corresponds to a value of "relative-colorimetric". 


RENDERING INTENT SATURATION (nsigned short) 


Corresponds to a value of "saturation". 


RENDERING INTENT  ABSOLUTE COLORIMETRİC (unsigned short) 


Corresponds to a value of "absolute-colorimetric". 
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6 Styling 


Contents 


6.1 SVG"s styling properties 
6.2 Usage scenarios for styling 
6.3 Alternative vvays to specify styling properties 
6.4 Specifying properties using the presentation attributes 
6.5 Styling vvith XSL 
6.6 Styling vvith CSS 
6.7 Case sensitivity of property names and values 
6.8 Facilities from CSS and XSL used by SVG 
6.9 Referencing external style sheets 
6.10 The “style” element 
6.11 The “class” attribute 
6.12 The “style” attribute 
6.13 Specifying the default style sheet language 
6.14 Property inheritance 
6.15 The scope/range of styles 
6.16 User agent style sheet 
6.17 Aural style sheets 
6.18 DOM interfaces 
6.18.1 Interface SVGStyleElement 


6.1 SVGs siyling properties 


SVG uses styling properties to describe many of its document parameters. Styling properties define hovv the 
graphics elements in the SVG content are to be rendered. SVG uses styling properties for the follovving: 


e Parameters vvhich are clearly visual in nature and thus lend themselves to styling. Examples include all at- 
tributes that define hovv an obiect is "painted," such as fill and stroke colors, linevvidths and dash styles. 

e Parameters having to do vvith text styling such as font family and size. 

e Parameters vvhich impact the vvay that graphical elements are rendered, such as specifying clipping paths, 
masks, arrovvheads, markers and filter effects. 


SVG shares many of its styling properties vvith CSS TCSS21 and XSL (XSLİ. Except for any additional SVG-specific 
rules explicitly mentioned in this specification, the normative definition of properties that are shared vvith CSS 
and XSL is the definition of the property from the CSS2 specification İCSS2). 

The follovving properties are shared betvveen CSS2 and SVG. Most of these properties are also defined in XSL: 
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e Font properties: 

o “font” 

o “font-family” 

o “font-size” 

o “font-size-adiust” 

o “font-stretch” 

o “font-style” 

o “font-variant” 

o “font-vveight” 

e "Text properties: 

o “direction” 

o “letter-spacing” 

o “text-decoration” 

o “unicode-bidi” 

o “yvord-spacing” 

e Other properties for visual media: 

o “clip”, only applicable to outermost svg element. 

o “color”, used to provide a potential indirect value (currentColor) for the “fill), “stroke”, “stop-color”, “flood- 
color” and “lighting-color” properties. (The SVG properties vvhich support color allovv a color specification 
vvhich is extended from (882 to accommodate color definitions in arbitrary color spaces. See Color pro- 
file descriptions.) 

o “cursor” 

o “display” 

o “overflovv”, only applicable to elements vvhich establish a nevv vievvport. 

o “visibility” 


"The follovving SVG properties are not defined in CSS2. The complete normative definitions for these properties are 
found in this specification: 


e Clipping, Masking and Compositing properties: 


o “clip-path” 
o “clip-rule” 
o “mask” 

o “opacity” 


e Filter Effects properties: 
o “enable-background” 
o “filter” 
o “flood-color” 
o “flood-opacity” 
o “İighting-color” 

e Gradient properties: 
o “stop-color” 


o “stop-opacity” 
e İInteractivity properties: 
o “pointer-events” 


e Color and Painting properties: 
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o “color-interpolation” 
o “color-interpolation-filters” 
o “color-profile” 


o “color-rendering” 


o “fil” 
o “fill-opacity” 
o “fill-rule” 


o “image-rendering” 


o “marker” 





o “marker-end” 
o “marker-mid” 
o “marker-start” 
o “shape-rendering” 
o “stroke” 
o “stroke-dasharray” 
o “stroke-dashoffset” 
o “stroke-linecap” 
o “stroke-line)oin” 
o “stroke-miterlimit” 
o “stroke-opacity” 
o “stroke-vvidth” 
o “text-rendering” 
e "Text properties: 
o “alignment-baseline” 
o “baseline-shift” 
o “dominant-baseline” 
o “gİyph-orientation-horizontal” 
o “gİyph-orientation-vertical” 
o “kerning” 
o “text-anchor” 


o “vvriting-mode” 
A table that lists and summarizes the styling properties can be found in the Property Index. 


6.2 Usage scenarios for styling 


SVG has many usage scenarios, each vvith different needs. Here are three common usage scenarios: 
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1. SVG content used as an exchange format (style sheet language-independent): 

m some usage scenarios, reliable interoperability of SVG content across softvvare tools is the main goal. 
Since support for a particular style sheet language is not guaranteed across all implementations, it is a re- 
quirement that SVG content can be fully specified vvithout the use of a style sheet language. 

2. SVG content generated as the output from XSLT: 

XSET offers the ability to take a stream of arbitrary XML content as input, apply potentially complex 
transformations, and then generate SVG content as output İXSLTİ. XSLT can be used to transform XML data 
extracted from databases into an SVG graphical representation of that data. İt is a requirement that fully spe- 
cifled SVG content can be generated from XSLT. 

3. SVG content styled vvith CSS: 

CSS is a vvidely implemented declarative language for assigning styling properties to XML content, in- 
cluding SVG İCSS2l. Tt represents a combination of features, simplicity and compactness that makes it very 
suitable for many applications of SVG. It is a requirement that CSS styling can be applied to SVG content. 


6.3 Alternative vvays to specify styling properties 


Styling properties can be assigned to SVG elements in the follovving tvvo vvays: 


e Presentation attributes 

Styling properties can be assigned using SVG"s presentation attributes. For each styling property 
defined in this specification, there is a corresponding XML presentation attribute available on all relevant 
SVG elements. Detailed information on the presentation attributes can be found in Specifying properties us- 
ing the presentation attributes. 

The presentation attributes are style sheet language independent and thus are applicable to usage scen- 
ario 1 above (i.e., tool interoperability). Because it is straightforvvard to assign values to XML attributes from 
XSLT, the presentation attributes are vvell-suited to usage scenario 2 above (i.e., SVG generation from XSLT). 
(See Styling vvith XSL belovv.) 

Conforming SVG Tnterpreters and Conforming SVG Vievvers are required to support SVG“s presentation 
attributes. 

ə CSS Stylesheets 

To support usage scenario 3 above, SVG content can be styled vvith CSS. For more information, see Styl- 
ing vvith CSS. 

Conforming SVG TInterpreters and Conforming SVG Vievvers that support CSS styling of generic (i.e., 
text-based) XML content are required to also support CSS styling of SVG content. 


6.4 Specifying properties using the presentation attributes 


For each styling property defined in this specification (see Property Index), there is a corresponding XML attribute 
(the presentation attribute) vvith the same name that is available on all relevant SVG elements. For example, SVG 
has a “fil” property that defines hovv to paint the interior of a shape. There is a corresponding presentation attrib- 
ute vvith the same name (i.e., “fill) that can be used to specify a value for the “fil” property on a given element. 
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The follovving example shovvs hovr the “filP and “stroke” properties can be specifted on a “rect” using the “fl” 
and “stroke” presentation attributes. The rectangle vvill be filled vvith red and outlined vvith blue: 


c?xml versionz"1.0" standalonez"no"?z 
xc DOCTYPE svg PUBLİC "-//V3C/ /DTD SVG 1.1//EN" 
"http: / /vvv/.vV3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
€svg xmlnse"http:/ /vvv/.v3.org/2000/svg" versione"1.1" 
vidth-"10cm" heightz"5cm" vieuvBoxze"0 0 1000 500" 
crect xze"200" ye-"100" vidth-"600" height-"300" 
fill-"red" strokeze"blue" stroke-vidth-"3"/5 
s/ svg” 


The presentation attributes offer the follovving advantages: 


e Broad support. All versions of Conforming SVG Tnterpreters and Conforming SVG Vievvers are required to 
support the presentation attributes. 

e Simplicity. Styling properties can be attached to elements by simply providing a value for the presentation 
attribute on the proper elements. 

e Restyling. SVG content that uses the presentation attributes is highly compatible vvith dovvnstream process- 
ing using XSLT (XSLT) TXSLT2) or supplemental styling by adding CSS style rules to override some of the 
presentation attributes. 

e Convenient generation using XSLT. In some cases, XSLT can be used to generate fully styled SVG content. 
The presentation attributes are compatible vvith convenient generation of SVG from XSLT. 


In some situations, SVG content that uses the presentation attributes has potential limitations versus SVG content 
that is styled vvith a style sheet language such as CSS (see Styling vvith CSS). In other situations, such as vvhen 
an XSET style sheet generates SVG content from semantically rich XML source files, the limitations belovv may 
not apply. Depending on the situation, some of the follovving potential limitations may or may not apply to the 
presentation attributes: 


e Styling attached to content. The presentation attributes are attached directly to particular elements, thereby 
diminishing potential advantages that comes from abstracting styling from content, such as the ability to re- 
style documents for different uses and environments. 

e Flattened data model. In and of themselves, the presentation attributes do not offer the higher level abstrac- 
tions that you get vvith a styling system, such as the ability to define named collections of properties vvhich 
are applied to particular categories of elements. The result is that, in many cases, important higher level se- 
mantic information can be lost, potentially making document reuse and restyling more difficult. 

e Potential increase in file size. Many types of graphics use similar styling properties across multiple ele- 
ments. For example, a company organization chart might assign one collection of styling properties to the 
boxes around temporary vvorkers (e.g., dashed outlines, red fill), and a different collection of styling prop- 
erties to permanent vvorkers (e.g., solid outlines, blue fill). Styling systems such as CSS allovv collections of 
properties to be defined once in a file. VVith the styling attributes, it might be necessary to specify presenta- 
tion attributes on each different element. 

e Potential difficulty vvrhen embedded into a CSS-styled parent document. VVhen SVG content is embedded 
in other XML, and the desire is to style all aspects of the compound document vvith CSS, use of the present- 
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ation attributes might introduce complexity and difficuliy. In this case, it is sometimes easier if the SVG con- 
tent does not use the presentation attributes and instead is styled using CSS facilities. 


For user agents that support CSS, the presentation attributes must be translated to corresponding CSS style rules 
according to rules described in Precedence of non-CSS presentational hints (İCSS2İ, section 6.4.4), vvith the addi- 
tional clarification that the presentation attributes are conceptually inserted into a nevv author style sheet vvhich is 
the first in the author style sheet collection. The presentation attributes thus vvill participate in the CSS2 cascade 
as if they vvere replaced by corresponding CSS style rules placed at the start of the author style sheet vvith a speci- 
ficity of zero. In general, this means that the presentation attributes have lovver priority than other CS5 style rules 
specifted in author style sheets or “style” attributes. 

User agents that do not support CSS must ignore any CSS style rules defined in CSS style sheets and “style” 
attributes. In this case, the CSS cascade does not appİy. (Inheritance of properties, hovvever, does apply. See Prop- 
erty inheritance.) 

An limportant declaration (İCSS2), section 6.4.2) vvithin a presentation attribute definition is an invalid value. 

Animation of presentation attributes is equivalent to animating the corresponding property. Thus, the same 
effect occurs from animating the presentation attribute vvith attributeType-"XML" as occurs vvith animating the 


corresponding property vvith attributeType-"CSS" (see “attributeType”). 


6.5 Styling vvith XSL 


XSL style sheets EXSLT) EXSLT2) define hovr to transform XML content into something else, usually other XML. 
VVhen XSET is used in con$unction vvith SVG, sometimes SVG content vvill serve as both input and output for XSL 
style sheets. Other times, XSL style sheets vvill take non-SVG content as input and generate SVG content as output. 

The follovving example uses an external XSL style sheet to transform SVG content into modified SVG content 
(see Referencing external style sheets). The style sheet sets the “fil” and “stroke” properties on all rectangles to red 


and blue, respectively: 


mystyle.xsl 
x?xml versionze"1.0" standalonez"no"?s 
exsl:stylesheet versionz"1.0" 
xmlns:xslz"http:/ /uvv/.v3.org/1999/XSL/Transform" 
xmlns:svge"http://uvv.v3.org/2000/svg"z 
exsl:output 
method-"xml" 
encoding-"utf-8" 
doctype-publice" -/ /V3C/ /DTD SVG 1.1//EN" 
doctype-system-"http://vuv.v3.org/Graphics/SVG/1.1/DTD/svg11.dtd"/5 
c1-- Add version to topmost "svg" element --s 
exsl:template matche"/svg:svg"z 
exsl:copyr 
exsl:copy-of selecte"ge"/s 
exsl:attribute namezc"version"s1.1-/xsl:attribute”s 
exsl:apply-templates/x” 
xc/xsl:copyx” 
e/xsl:templatex 
c1-- Add styling to all "rect" elements --s 
exsl:template match-"svg:rect"s 
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exsl:copyr 
exsl:copy-of selecte"ge"/s 
exsl:attribute namee"fill"-red-/xsl:attributex 
exsl:attribute namee"stroke"sbluec/xsl:attributex 
exsl:attribute namee"stroke-vidth"s3-/xsl:attributex 
xc/xsl:copy” 
c/xsl:templatex 
x/xsl:stylesheet- 


SVG file to be transformed by mystyle.xs1 
x?xml versionze"1.0" standalonez"no"?s 
c?xml-stylesheet href-"mystyle.xsl" typez"application/xml"?- 
xsvg xmlnsze"http: / /vvv..vV3.org/2000/svg" 
vidth-"10cm" height-"5cm"- 
crect xe"2cm" ye"lcm" vidth-"öcm" height-"3cm"/5 
c/ sVg” 


SVG content after applying mystyle.xsl 
e?xml versione"1.0" encodinge"utf-8"2- 
x DOCTYPE svg PUBLİC "-//03C//DTD SVG 1.1//EN" 
"http: / /vvvv .v/3.0rg/Graphics/SVG/1.1/DTD/svg11.dtd"z 

xsvg xmlnsz"http: / /vvuv.vV3.0Tg/2000/svg" 

vidth-"10cm" height-"5cm" version-"1.1"- 

xrect xe"2cm" ye"lcm" vidth-"öcm" height-"3cm" fill-"red" strokeze"blue" stroke-vidth-"3"/5 

xc/ sVg” 


6.6 Styling vvith CSS 


SVG implementations that support CSS are required to support the follovving: 


e External CS style sheets referenced from the current document (see Referencing external style sheets) 

e Internal CSS style sheets (i.e., style sheets embedded vvithin the current document, such as vvithin an SVG 
“style” element) 

e Inline style (i.e., CSS property declarations vvithin a “style” attribute on a particular SVG element) 


"The follovring example shovvs the use of an external CSS style sheet to set the “fil” and “stroke” properties on all 


rectangles to red and blue, respectively: 


mystyle.css 

rect 1 
fill: red, 
stroke: blue, 
stroke-vidth: 3 

l 


SVG file referencing mystyle.css 
c?xml versionze"1.0" standalonez"no"?s 
e?xml-stylesheet hrefe"mystyle.css" typeze"text/css"?s 
x DOCTYPE svg PUBLİC "-//03C//DTD SVG 1.1//EN" 
"http: /vvvv .v3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
xsvg xmlnse"http: / /vvuv..vV3.org/2000/svg" versione"1.1" 
vidth-"10cm" height-"5cm" vievBoxz"0 0 1000 500" 
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crect xe"200" y-"100" vidth-"600" height-"300"/5 
x/ svg” 


CSS style sheets can be embedded vvithin SVG content inside of a “style” element. The follovving example uses an 


internal CSS style sheet to achieve the same result as the previous example: 


c?xml versionz"1.0" standalone-"no"?x 
x İDOCTYPE svg PUBLİC "-//V/3C//DTD SVG 1.1//EN" 
"http: / /vuv/.vV3.org/Graphics/SVG/1.1/DTD/svg11.dtd"s 
x€Ssvg xmlnse"http://uuv/.vV3.org/2000/svg" versione"1.1" 
vidth-"10cm" heightze"5cm" vieuvBoxz"0 0 1000 500" 
edefsəs 
estyle typez"text/css"s-ci TCDATAT 
rect ( 
fill: red, 
stroke: blue, 
stroke-vidth: 3 


) 
11:c/styles 
e/defs- 
crect xz"200" y-"100" vidth-"600" height-"300"/5 
s/ svg” 


Note hovr the CSS style sheet is placed vvithin a CDATA construct (i.e., cI TCDATAL ... 11x). Placing internal CSS 
style sheets vvithin CDATA blocks is sometimes necessary since CSS style sheets can include characters, such as "-", 
vvhich conflict vvith XML parsers. Even if a given style sheet does not use characters that conflict vvith XML pars- 
ing, it is highly recommended that internal style sheets be placed inside CDATA blocks. 

Implementations that support CSS are also required to support CSS inline style. Similar to the “style” attribute 
in HTML, CSS inline style can be declared vvithin a “style” attribute in SVG by specifying a semicolon-separated 
list of property declarations, vvhere each property declaration has the form "name: value", Note that property de- 
clarations inside the “siyle” attribute must follovv CSS style rules, see The "style" attribute. 

The follovving example shovvs hovv the “fill” and “stroke” properties can be specifted on a “rect” using the “style” 


attribute. yust like the previous example, the rectangle vvill be filled vvith red and outlined vvith blue: 


c?xml versionz"1.0" standalonez"no"?z 
x DOCTYPE svg PUBLİC "-//V/3C/ /DTD SVG 1.1//EN" 
"http: / /vvv/.vV/3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
€svg xmlnse"http:/ /vvv/.v3.org/2000/svg" versione"1.1" 
vidth-"10cm" heightz"5cm" vieuvBoxze"0 0 1000 500" 
crect xze"200" ye"100" vidth-"600" height-"300" 
styleze"fill: red, stroke: blue, stroke-vidth: 3"/x 
xs/ svg” 


In an SVG user agent that supports CSS style sheets, the follovving facilities from CSS2 must be supported: 


e (CS82 selectors vvithin style sheets (TCSS2), chapter 5). Because SVG is intended to be used as one component 
in a multiple namespace XML application and CS82 is not namespace avvare, type selectors vvill only match 
against the local part of the elements qualified name. 

e External CSS style sheets PXML-SSİ, CSS style sheets vvithin “style” elements and CSS declaration blocks 
(İCSS2), section 4.1.7) vvithin “style” attributes attached to specific SVG elements. 

ə (CSS2 rules for assigning property values, cascading and inheritance (TCSS2), chapter 6). 

e (Əfont-face, (ömedia, (ƏGimport and (öcharset rules vvithin style sheets (TCSS2İ, sections 15.3.1, 7.2.1, 6.3 and 
4.4). 

e CSSZs dynamic pseudo-classes :hover, :active and :focus and pseudo-classes “first-child, -visited, :link and 
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“lang (TCSS2), section 5.11). The remaining CS52 pseudo-classes, including those having to do vvith generated 
content (TCSS2), chapter 12), are not part of the SVG language definition. An SVG element gains focus vvhen 
it is selected. See Text selection. 

e For the purposes of aural media, SVG represents a CSS-stylable XML grammar. In user agents that support 
aural style sheets, CSS aural style properties can be applied as defined in CSS2 (TCSS2İ, chapter 19). (See 
Aural style sheets.) 

e CSS style sheets defined vvithin a “style” element can be immediate character data content of the “style” ele- 
ment or can be embedded vvithin a CDATA section (TXML10l, section 2.7). 


SVG defines an (öcolor-profile at-rule (TCSS2), section 4.1.6) for defining color profiles so that ICC color profiles 
can be applied to CSS-styled SVG content. 

Note the follovving about relative URIs and external CSS style sheets: The CSS2 specification says (İCSS2), 
section 4.3.4) that relative URIs (as defined in Uniform Resource Identifiers (UR1): Generic Syntax TRFC3986)) vvith- 
in style sheets are resolved such that the base UR1 is that of the style sheet, not that of the referencing document. 


6.7 Case sensitivity of property names and values 


Property declarations via presentation attributes are expressed in XML IXML10), vvhich is case-sensitive. CSS 
property declarations specified either in CSS style sheets or in a “style” attribute, on the other hand, are generally 
case-insensitive vvith some exceptions (TCSS2İ, section 4.1.3). 

Because presentation attributes are expressed as XML attributes, presentation attributes are case-sensitive 
and must match the exact name as specifted in the DTD (see the SVG.Presentation.attrib entity in the DTD, 
vvhich expands to all of the presentation attributes). VVhen using a presentation attribute to specify a value for 
the “ill” property, the presentation attribute must be be specifted as fill-"..." and not fill-"..." or Fill-"...". Keyvvord 
values, such as italic in font-style-"italic", are also case-sensitive and must be specifted using the exact case used in 
the specification vvhich defines the given keyvvord. For example, the keyvvord sRGB must have lovvercase "s" and 
uppercase "RGB". 

Property declarations vvithin CSS style sheets or in a “style” attribute must only conform to CSS rules, vvhich 
are generally more lenient vvith regard to case sensitivity. Hovvever, to promote consisteney across the different 
vvays for expressing styling properties, it is strongly recommended that authors use the exact property names (usu- 
ally, 1ovvercase letters and hyphens) as defined in the relevant specification and express all keyvvords using the 
same case as is required by presentation attributes and not take advantage of CSS"s ability to ignore case. 


6.8 Facilities from CSS and XSL used by SVG 


SVG shares various relevant properties and approaches common to CSS and XSL, plus the semantics of many of 
the processing rules. 
SVG shares the follovving facilities vvith CSS and XSL: 


ə Shared properties. Many of SVG"s properties are shared betvveen CSS2, XSL and SVG. (See list of shared prop- 
erties). 


e Syntax rules. (Ihe normative references are CSS2 syntax and basic data types and The grammar of CSS2, in 
İCSS2İ, chapter 4 and appendix D.) 

ə Allovvable data types. (Ihe normative reference is CSS2 syntax and basic data types (TCSS2), chapter 4), vvith 
the exception that SVG length and angle values vvithout a unit identifter. See Units.) 

e Inheritance rules. 

e "he color keyvvords from C882 that correspond to the colors used by obiects in the user"s environment. (1he 
normative reference is CSS2 system colors: in İCSS2), section 18.2.) 

e For implementations that support CSS styling of SVG content, then that styling must be compatible vvith 
various other rules in CSS. (See Styling vvith CSS.) 
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6.9 Referencing external style sheets 





External style sheets are referenced using the mechanism documented in Associafing Style Sheets vvith XML doc- 
uments Version 1.0 (XML-SSİ. 


6.10 The “style” element 


"The “style” element allovvs style sheets to be embedded direetly vvithin SVG content. SVG“s “style” element has the 
same attributes as the corresponding element in HTML (see HTML.s “style” element). 


Categories: “style” 
None 


Content model: 
Any elements or character data. 


Attributes: 
core attributes 
7. 
“media” 
“title” 

DOM Interfaces: 
SVGstyleElement 


Attribute definitions: 


type — content-iype 
"his attribute specifies the style sheet language of the elements contents. The style sheet language is specifted 
as a content type (e.g., "text/css"), as per MIME Part Tvvo: Media Types İRFC20461. If a “type” is not provided, 
the value of “contentStyleType” on the “svg” element shall be used, vvhich in turn defaults to "text/css" 
İRFC2046l. If a “style” element falls outside of the outermost svg element and the “type” is not provided, the 
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“type” must default to "text/ess" İRFC20461. 
Animatable: no. 


media - media-descriptors 
"This attribute specifles the intended destination medium for style information. It may be a single media 
desecriptor or a comma-separated list. The default value for this attribute is "all". The set of recognized media- 
descriptors are the list of media types recognized by CS82 (İCSS2), section 7.3). 
Animatable: no. 


title — advisory-title 
(For compatibility vvith HTML 4 THTMLAl.) This attribute specifies an advisory title for the “style” element. 


Animatable: no. 


"The syntax of style data depends on the style sheet language. 
Some style sheet languages might allovv a vvider variety of rules in the “siyle” element than in the “style”. For 
example, vvith CSS, rules can be declared vvithin a “style” element that cannot be declared vvithin a “style” attribute. 
An example shovving the “style” element is provided above (see example). 


6.11 The “class” attribute 


Attribute definitions: 


class - list 
"This attribute assigns a class name or set of class names to an element. Any number of elements may be 
assigned the same class name or names. Multiple class names must be separated by vvhite space characters. 


Animatable: yes. 


"The “class” attribute assigns one or more class names to an element. The element may be said to belong to these 
classes. A class name may be shared by several element instances. The “class” attribute has several roles: 


e As a style sheet selector (vrhen an author vvishes to assign style information to a set of elements). 


e For general purpose processing by user agents. 


In the follovving example, the “text” element is used in con/unction vvith the “class” attribute to markup document 


messages. Messages appear in both English and French versions. 


c1-- English messages --s 

etext classe"info" lange-"en"sVariable declared tvicec/textə” 

etext classe"varning" l1ang-"en"sUndeclared variable-c/texts 

etext classe"error" 1ange"en"sBad syntax for variable name-/text” 
c1-- French messages --x 

etext classe"info" lang-"fr"sVariable declaree deux foisc/textx 
etext classe"varning" lang-"fr"-Variable indefiniec/text” 

etext classe"error" 1ange"fr"sErreur de syntaxe pour variablec/textə- 
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In an SVG user agent that supports CSS styling, the follovving CSS style rules vvould tell visual user agents to dis- 
play informational messages in green, vvarning messages in yellovv, and error messages in red: 


text.info ( color: green ) 
text.varning ( color: yellov 1) 
text.error ( color: red ) 


6.12 The “style” attribute 


"The “style” attribute allovvs per-element style rules to be specifted directly on a given element. VVhen CSS styling 
is used, CSS inline style is specifled by including semicolon-separated property declarations of the form "name : 
value" vvithin the “style” attribute. Property declarations must follovv CSS style rules thus CSS defined properties 
(e.g. font-size") vvhen having a -length: value must include a unit (for non-zero values). See SVG"s styling proper- 
ties for a list of CSS defined properties. 


Attribute definitions: 


style - siyle 
"This attribute specifies style information for the current element. The style attribute speciftes style inform- 
ation for a single element. The style sheet language of inline style rules is given by the value of attribute 
“contentStyleType” on the “svg” element. The syntax of style data depends on the style sheet language. 


Animatable: no. 


"The style attribute may be used to apply a particular style to an individual SVG element. If the style vvill be reused 
for several elements, authors should use the “style” element to regroup that information. For optimal flexibility, 
authors should define styles in external style sheets. 

An example shovving the “style” attribute is provided above (see example). 


6.13 Specifying the default style sheet language 


"The “contentSiyleType” attribute on the “svg” element speciftes the default style sheet language for the given docu- 


ment fragment. 


contentStyleType -— "confent-type" 
Identiftes the default style sheet language for the given document. That language must then be used for 
all instances of style that do not specify their ovvn style sheet language, such as the “siyle” attributes that 
are available on many elements. The value confenf-type speciftes a media type, per MIME Part Tvvo: Media 
Types İRFC20461. The default value is "text/ess" TRFC2318İ. 


Animatable: no. 


Since the only vvidely deployed language used for inline styling (in style elements and style attributes) is CSS, and 
since that is already the default language if contentStyleType is omitted, in practice contentStyleType is not vvell 
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supported in user agents. XSL style sheets are typically external, If a nevv style sheet language becomes popular, 
it might not use style attributes and could easily declare vvhich language is in use vvith the type attribute on the 
style element. 

The use of contentStyleType is therefore deprecated: nevv content should not use it. Future versions of the 
SVG specification may remove contentStyleType. 


6.14 Properiy inheritance 


VVhether or not the user agent supports CS5, property inheritance in SVG follovvs the property inheritance rules 
defined in the CS82 specification. The normative definition for property inheritance is the Inheritance section of 
the CSS2 specification (TCSS2), section 6.2). 

The definition of each property indicates vvhether the property can inherit the value of its parent. 

m SVG, as in CS82, most elements inherit computed values (İCSS2)l, section 6.1.2). For cases vvhere something 
other than computed values are inherited, the property definition vvill describe the inheritance rules. For specified 
values (TCSS2)l, section 6.1.1) vvhich are expressed in user units, in pixels (e.g., 20px) or in absolute values, the 
computed value equals the specified value. For specified values vvhich use certain relative units (i.e., em, ex and 
percentages), the computed value vvill have the same units as the value to vvhich it is relative. Thus, if the parent 
element has a “font-size” of 10pt and the current element has a “font-size” of 12077, then the computed value for “font- 
size” on the current element vvill be 12pt. In cases vvhere the referenced value for relative units is not expressed 
in any of the standard SVG units (i.e., CSS units or user units), such as vvhen a percentage is used relative to the 
current vievvport or an obfect bounding box, then the computed value vvill be in user units. 

Note that SVG has some facilities vvherein a property vvhich is specified on an ancestor element might effect 
its descendant element, even if the descendant element has a different assigned value for that property. For ex- 
ample, if a “clip-path” property is specifted on an ancestor element, and the current element has a “clip-path” of 
none, the ancestor"s clipping path still applies to the current element because the semantics of SVG state that the 
clipping path used on a given element is the intersection of all clipping paths specifted on itself and all ancestor 
elements. The key concept is that property assignment (vvith possible property inheritance) happens first. After 
properties values have been assigned to the various elements, then the user agent applies the semantics of each 
assigned property, vvhich might result in the property assignment of an ancestor element affecting the rendering 
of its descendants. 


6.15 The scope/range of styles 
"The follovving define the scope/range of style sheets: 


Stand-alone SVG document 
"There is one parse tree. Style sheets defined anyvvhere vvithin the SVG document (in style elements or style 
attributes, or in external style sheets linked vvith the style sheet processing instruction) apply across the en- 
tire SVG document. 
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Stand-alone SVG document embedded in an HTML or XML document vvith the “img”, “obiect” (HTML) or “im- 

age” (SVG) elements 
There are tvvo completely separate parse trees, one for the referencing document (perhaps HTML or 
XHTML), and one for the SVG document. Style sheets defined anyvvhere vvithin the referencing document 
(in style elements or style attributes, or in external style sheets linked vvith the style sheet processing instruc- 
tion) appİy across the entire referencing document but have no effect on the referenced SVG document. Style 
sheets defined anyvvhere vvithin the referenced SVG document (in style elements or style attributes, or in ex- 
ternal style sheets linked vvith the style sheet processing instruction) apply across the entire SVG document, 
but do not affect the referencing document (perhaps HTML or XHTML),. To get the same styling across both 
the (XIHTML document and the SVG document, link them both to the same style sheet. 

Stand-alone SVG content textually included in an XML document 
There is a single parse tree, using multiple namespaces, one or more subtrees are in the SVG namespace. 
Style sheets defined anyvvhere vvithin the XML document (in style elements or style attributes, or in external 
style sheets linked vvith the style sheet processing instruction) apply across the entire document, including 
those parts of it in the SVG namespace. To get different styling for the SVG part, use the “style” attribute, or 
put an “id” on the “svg/ element and use contextual CSS selectors, or use XSL selectors. 


6.16 User agent style sheet 


"The user agent shall maintain a user agent style sheet (TCSS2), section 6.4) for elements in the SVG namespace for 
visual media (TCSS2), section 7.3.1). The user agent style sheet belovv is expressed using CSS syntax: hovvever, user 
agents are required to support the behavior that corresponds to this default style sheet even if CSS style sheets are 
not supported in the user agent: 


svg, symbol, image, marker, pattern, foreignübiect 1 overflov: hidden ) 
svg ( vidth:attr(vidth), height:attr(height) ) 


"The first line of the above user agent style sheet vvill cause the initial clipping path to be established at the bounds 
of the initial vievvport. Furthermore, it vvill cause nevv clipping paths to be established at the bounds of the listed 
elements, all of vvhich are elements that establish a nevv vievvport. (Refer to the description of SVG"s use of the 
“overflovv” property for more information.) 

The second line of the above user agent style sheet vvill cause the “vidth” and “height” attributes on the “svg” 
element to be used as the default values for the “vidth" and "height" properties during layout (İCSS2), chapter 9). 


6.17 Aural siyle sheets 


For the purposes of aural media, SVG represents a stylable XML grammar. In user agents that support CSS aural 
style sheets, aural style properties (TCSS2), chapter 19) can be applied as defined in CSS2. 

Aural style properties can be applied to any SVG element that can contain character data content, including 
“desc” “title” “tspan”, “tref”, “aliGiyph” and “textPath”. On user agents that support aural style sheets, the follovving 
CSS2 properties can be applied: 
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Aural property Definition in İCSS21 
“azimuth” Section 19.7 
“cue” Section 19.5 
“cue-after” Section 19.5 
“cue-before” Section 19.5 
“elevation” Section 19.7 
“pause” Section 19.4 
“pause-after” Section 19.4 
“pause-before” Section 19.4 
“pitch” Section 19.8 
“pitch-range” Section 19.8 
“play-during” Section 19.6 
“richness” Section 19.8 
“speak” Section 19.3 
“speak-header” Section 17.7.1 
“speak-numeral” Section 19.9 


“speak-punctuation” Section 19.9 


“speech-rate” Section 19.8 
“stress” Section 19.8 
“voice-family” Section 19.8 
“volume” Section 19.2 


For user agents that support aural style sheets and also support DOM Level 2 Core İDOMA2), the user agent is 
required to support the DOM interfaces defined in Document Obiect Model CSS (İDOM2STYLE), chapter 2) that 
correspond to aural properties. (See Relationship vvith DOM2 CSS obiect model.) 
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6.18 DOM interfaces 


6.18.1 Interface SVGSiyleElement 


The SVGStyleElement interface corresponds to the “style” element. 


interface SV6StyleElement : SVGElement, 

SVGLangSpace 1 
attribute DOMString type setraises(DOMException) , 
attribute DÜMString media setraises (DOMException) , 
attribute DOMString title setraises(DOüMException), 
y 


Aftributes: 


e type (DOMString) 


Corresponds to attribute “type” on the given element. 


Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e media (DOMSiring) 
Corresponds to attribute “media” on the given element. 


Exceptions on setting 
e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 


Raised on an attempt to change the value of a read only attribute. 


e title (DOMSiring) 


Corresponds to attribute “title” on the given element. 


Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 
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7 Coordinate Systems, Transformations and Units 


Contents 


7.1 Introduction 
7.2 The initial vievvport 
7.3 The initial coordinate system 
7.4 Coordinate system transformations 
7.5 Nested transformations 
7.6 The “transform” attribute 
7.7 The “vievvBox” attribute 
7.8 The “prreserveAspectRatio” attribute 
7.9 Establishing a nevv vievvport 
7.10 Units 
7.11 Obfect bounding box units 
7.12 İntrinsic sizing properties of the vievvport of SVG content 
7.13 Geographic coordinate systems 
7.14 The “svg:transform” attribute 
7.15 DOM interfaces 
7.15.1 Interface SVGPoint 
7.15.2 Interface SVGPointlList 
7.15.3 Interface SVGMatrix 
7.15.4 Interface SVGTransform 
7.15.5 Interface SVGTransformlList 
7.15.6 Interface SVGAnimatedTransformList 
7.15.7 Interface SVGPreserveAspectRatio 
7.15.8 Interface SVGAnimatedPreserveAspectRatio 


7.1 İntroduction 


For all media, the SVG canvas describes "the space vvhere the SVG content is rendered" The canvas is infinite for 
each dimension of the space, but rendering occurs relative to a finite rectangular region of the canvas. This finite 
rectangular region is called the SVG vievvport. For visual media (İCSS2), section 7.3.1) the SVG vievvport is the 
vievving area vvhere the user sees the SVG content. 

The size of the SVG vievvport (i.e., its vvidth and height) is determined by a negotiation process (see Estab- 
lishing the size of the initial vievvport) betvveen the SVG document fragment and its parent (real or implicit). Once 
that negotiation process is completed, the SVG user agent is provided the follovving information: 


e a number (usually an integer) that represents the vvidth in "pixels" of the vievvport 
e a number (usually an integer) that represents the height in "pixels" of the vievvport 


c 
.o 
5 
İv) 
m") 
(s 
(3) 
c 
E 
ə) 
(ə) 
o 
ad 
. 
s 





e (highly desirable but not required) a real number value that indicates the size in real vvorld units, such as 
millimeters, of a "pixel" (i.e., a px unit as defined in CSS2 (İCSS2İ, section 4.3.2) 


Using the above information, the SVG user agent determines the vievvport, an initial vievvport coordinate sys- 
tem and an initial user coordinate system such that the tvvo coordinates systems are identical. Both coordinates 
systems are established such that the origin matches the origin of the vievvport (for the root vievvport, the vievvport 
origin is at the top/left corner), and one unit in the initial coordinate system equals one "pixel" in the vievvport. 
(See Tnitial coordinate system.) The vievvport coordinate system is also called vievvport space and the user co- 
ordinate system is also called user space. 

Lengths in SVG can be specifted as: 


e (if no unit identifter is provided) values in user space — for example, "15" 
e (if a unit identifter is provided) a length expressed as an absolute or relative unit measure — for example, 
"15mm" or "5em" 


"The supported length unit identifters are: em, ex, px, pt, pc, em, mm, in, and percentages. 

A nevv user space (i.e., a nevv current coordinate system) can be established at any place vvithin an SVG docu- 
ment fragment by specifying transformations in the form of transformation matrices or simple transformation 
operations such as rotation, skevving, scaling and translation. Establishing nevv user spaces via coordinate system 
transformations are fundamental operations to 2D graphics and represent the usual method of controlling the size, 
position, rotation and skevv of graphic obiects. 

Nevv vievvports also can be established. By establishing a nevv vievvport, you can redefine the meaning of 
percentages units and provide a nevv reference rectangle for "Htting" a graphic into a particular rectangular area. 
(Fit" means that a given graphic is transformed in such a vvay that its bounding box in user space aligns exactly 
vvith the edges of a given vievvport.) 


7.2 The initial vievvport 


"The SVG user agent negotiates vvith its parent user agent to determine the vievvport into vvhich the SVG user agent 
can render the document. In some circumstances, SVG content vvill be embedded (by reference or inline) vvithin a 
containing document. This containing document might include attributes, properties and/or other parameters (ex- 
plicit or implicit) vvhich specify or provide hints about the dimensions of the vievvport for the SVG content. SVG 
content itself optionally can provide information about the appropriate vievvport region for the content via the 
“vvidih” and “height” XML attributes on the outermost svg element. The negotiation process uses any information 
provided by the containing document and the SVG content itself to choose the vievvport location and size. 

The “vidih” attribute on the outermost svg element establishes the vievvport"s vvidth, unless the follovring con- 
ditions are met: 


e the SVG content is a separately stored resource that is embedded by reference (such as the “obiect” element in 
XHTML IXHTMLİ)), or the SVG content is embedded inline vvithin a containing document, 

e and the referencing element or containing document is styled using CSS TCSS2) or XSL İXSLİ: 

e and there are CSS-compatible positioning properties ((CSS2), section 9.3) specified on the referencing element 


c 
.o 
5 
İv) 
m") 
(s 
(3) 
c 
E 
ə) 
(ə) 
o 
ad 
. 
s 





(e.g., the “obiect” element) or on the containing document"s outermost svg element that are sufficient to estab- 
lish the vvidth of the vievvport. 


Under these conditions, the positioning properties establish the vievvport"s vvidth. 

Similarly, if there are positioning properties specified on the referencing element or on the outermost svg 
element that are sufficient to establish the height of the vievvport, then these positioning properties establish the 
vievvport/s height, othervvise, the “heighi” attribute on the outermost svg element establishes the vievvport/s height. 

If the “vridth” or “height” attributes on the outermost svg element are in user units (1.e., no unit identifter has 
been providedl), then the value is assumed to be equivalent to the same number of "px" units (see Units). 

m the follovving example, an SVG graphic is embedded inline vvithin a parent XML document vvhich is 
formatted using CSS layout rules. Since CSS positioning properties are not provided on the outermost svg element, 
the vvidih-"100px" and height-"200px" attributes determine the size of the initial vievvport: 


e?xml versione"1.0" standalonez"yes"?s 
cparent xmlnse"http://some.ur1l"s 


c1-- SVG graphic --xs 

xsvg xmlnse"http: / /vvv/.vV3.org/2000/svg" 
vidth-"100px" height-"200px" versione"1.1"- 
cpath d-"M100, 100 0200, 400,300, 100"/5 
c1-- rest of SVG graphic vould go here --s 

c/ svg” 


c/ parentx” 


"The initial clipping path for the SVG document fragment is established according to the rules described in The 
initial clipping path. 


7.3 The initial coordinate system 


For the outermost svg element, the SVG user agent determines an initial vievvport coordinate system and an 
initial user coordinate system such that the tvvo coordinates systems are identical. The origin of both coordinate 
systems is at the origin of the vievvport, and one unit in the initial coordinate system equals one "pixel" (i.e.,, a px 
unit as defined in CSS2 (TCSSZ2), section 4.3.2) in the vievrport. In most cases, such as stand-alone SVG documents 
or SVG document fragments embedded (by reference or inline) vvithin XML parent documents vvhere the parent"s 
layout is determined by CSS TCSS2İ) or XSL İXSLİ, the initial vievvport coordinate system (and therefore the initial 
user coordinate system) has its origin at the top/left of the vievvport, vvith the positive x-axis pointing tovvards the 
right, the positive y-axis pointing dovvn, and text rendered vvith an "upright" orientation, vvhich means giyphs are 
oriented such that Roman characters and full-size ideographic characters for Asian scripts have the top edge of the 
corresponding giyphs oriented upvvards and the right edge of the corresponding glyphs oriented to the right. 

If the SVG implementation is part of a user agent vvhich supports styling XML documents using CSS2 com- 
patible px units, then the SVG user agent should get its initial value for the size of a px unit in real vvorld units to 
match the value used for other XML styling operations: othervvise, if the user agent can determine the size of a px 
unit from its environment, it should use that value: othervvise, it should choose an appropriate size for one px unit. 
In all cases, the size of a px must be in conformance vvith the rules described in CSS2 (TCSS2)l, section 4.3.2). 
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Example TnitialCoords belovv shovvs that the initial coordinate system has the origin at the top/left vvith the 
x-axis pointing to the right and the y-axis pointing dovvn. The initial user coordinate system has one user unit 
equal to the parent (implicit or explicit) user agent"s "pixel", 


c?xml versionz"1.0" standalone-"no"?z 
€ DOCTYPE svg PUBLİC "-//V3C//DTD SVG 1.1//EN" 
"http: / /uv .v/3.org/Graphics/SVG/1.1/DTD/svg11.dtd"x 
s€svg vidth-"300px" height-"100px" versionz"1.1" 
xmlnsze"http: / /vv/ .v/3..0T9/2000/svg"z 
ecdescsExample InitialCoords - SVG"s initial coordinate system-/desc” 


sg fill-"none" strokeze"black" stroke-vidth-"3" 5 
eline x1-"0" yl-"1.5" x2-"300" y2-"1.5" /5 
eline x1-"1.5" yl-"0" x2-"1.5" y2-"100" /5 

x/g” 

sg fill-"red" strokez"none" s 
crect xe"0" ye"0" vidth- 
crect xz"297" y-"0" vidth 
crect xe"0" yz"97" vidth- 

x/g” 

sg font-sizez"14" font-family-"Verdana" 5 
etext xe"10" yz"20"5(0,0)-/text- 






heighte"3" /s 
" height-"3" /5 
3" height-"3" /s 












€text xc 20"5(300,0)-/textə- 
etext xz"10" yz"90":(0,100)-/text- 
x/g” 
x/svg” 


Example HitialCoords 





(0,0) (300,0) 


(0,100) 


7.4 Coordinate system transformations 


A nevv user space (i.e., a nevv current coordinate system) can be established by specifying transformations in the 
form of a “transform” attribute on a container element or graphics element or a “vievvBox” attribute on an “svg”, 
“symbol”, “marker, “pattern” and the “vievv” element. The “transform” and “vievvBox” attributes transform user space 
coordinates and lengths on sibling attributes on the given element (see effect of the “transform” attribute on sibling 
attributes and effect of the “vievvBox” attribute on sibling attributes) and all of its descendants. Transformations 
can be nested, in vvhich case the effect of the transformations are cumulative. 

Example OrigCoordSys belovv shovvs a document vvithout transformations. The text string is specifted in the 
initial coordinate system. 


c?xml versionz"1.0" standalone-"no"?z 
€ DOCTYPE svg PUBLİC "-//V3C//DTD SVG 1.1//EN" 
"http: / /uMv/v .v3.org/Graphics/SVG/1.1/DTD/svg11.dtd"x 
s€svg vidth-"400px" height-"150px" 
xmlnsze"http: / /vv/ .vV3.0T9/2000/svg" versionz"1.1"5 
cdescsExample OrigCoordSys - Simple transformations: original picturec/desc” 
sg fill-"none" strokee"black" stroke-vidth-"3" 5 
c1-- Drav the axes of the original coordinate system --x 
eline x1z"0" yl-"1.5" x2-"400" y2-"1.5" /s 
eline x1z"1.5" ylı-"0" x2-"1.5" y2-"150" /5 
x/g” 


cg” 
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etext xe"30" yz-"30" font-sizez"20" font-family-"Verdana" x 
ABC (orig coord system) 
c/text- 
x/g” 
x/ svg” 


Example OrigCoordSys 





ABC (orig coord system) 


Example NevvCoordSys establishes a nevv user coordinate system by specifying transform-"translate(50,50)" on the 
third “g” element belovv. The nevv user coordinate system has its origin at location (50,50) in the original coordin- 
ate system. The result of this transformation is that the coordinate (30,30) in the nevv user coordinate system gets 
mapped to coordinate (80,80) in the original coordinate system (i.e., the coordinates have been translated by 50 
units in X and 50 units in Y). 


c?xml versionz"1.0" standalone-"no"?z 
€ DOCTYPE svg PUBLİC "-//V3C//DTD SVG 1.1//EN" 
"http: / /vvv/.vV3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
s€svg vidth-"400px" height-"150px" 
xmlnsze"http: / /vuv/ .vV3.0T9/2000/svg" versionz"1.1"5 
edescsExample Nev/CoordSys - Nev user coordinate system-/desc” 
eg fill-"none" strokeze"black" stroke-vidth-"3" 5 
c1-- Drav the axes of the original coordinate system --x 
eline x1-"0" yl-"1.5" x2-"400" y2z-"1.5" /5 
eline x1-"1.5" yl-"0" x2e"1.5" y2e-"150" /5 
x/g” 
eg” 
etext xz"30" yz"30" font-sizez"20" font-family-"Verdana" x 
ABC (orig coord system) 
c/text” 
x/g” 
c1-- Establish a nev coordinate system, vhich is 
shifted (i.e., translated) from the initial coordinate 
system by 50 user units along each axis. --s 
sg transform-"translate(50,50)"x5 
sg fill-"none" strokez"red" stroke-vidthe"3" s 
c1-- Drav lines of length 50 user units along 
the axes of the nev coordinate system --x 
eline x1z-"0" yl-"0" x2-"50" y2-"0" strokez"red" /5 
eline x1z-"0" yl-"0" x2-"0" y2-"50" /5 
x/g” 
etext xz"30" yz"30" font-sizez"20" font-family-"Verdana" x 
ABC (translated coord system) 
c/text” 
x/g” 
x/svg” 





Example NevvCoordSys 





ABC (orig coord system) 
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ABC (translated coord system) 


Example RotateScale illustrates simple rotate and scale transformations. The example defines tvvo nevv coordinate 
systems: 





e one vvhich is the result of a translation by 50 units in X and 30 units in Y, follovved by a rotation of 30 degrees 
e another vvhich is the result of a translation by 200 units in X and 40 units in Y, follovved by a scale transform- 
ation of 1.5. 


c?xml versionz"1.0" standalone-"no"?x 
€ DOCTYPE svg PUBLİC "-//V3C//DTD SVG 1.1//EN" 
"http: / /vvv/.vV3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
c€svg vidth-"400px" height-"120px" versione"1.1" 
xmlnsz"http: / /vuvv..v/3.0T9/2000/svg"z 
edescsExample RotateScale - Rotate and scale transforms-/desc- 
sg fill-"none" strokeze"black" stroke-vidth-"3" 5 
c1-- Drav the axes of the original coordinate system --x 
eline x1z"0" yl-"1.5" x2-"400" y2-"1.5" /s 
eline x1z"1.5" yı-"0" x2-"1.5" y2-"120" /5 
xc/g” 
c1-- Establish a nev coordinate system vhose origin is at (50,30) 
in the initial coord. system and vhich is rotated by 30 degrees. --x 
sg transform-"translate(50, 30)" 
€g transform-"rotate(30)"x 
eg fill-"none" strokez"red" stroke-vidth-"3" xs 
eline x1-"0" yl-"0" x2-"50" y2z"0" /s 
eline x1-"0" yl-"0" x2-"0" y2z"50" /5 
x/g? 
etext xe"0" y-"0" font-sizez"20" font-family-"Verdana" fill-"blue" x 
ABC (rotate) 


ce/text- 
x/g” 
x/g” 
c1-- Establish a nev coordinate system vhose origin is at (200,40) 
in the initial coord. system and vhich is scaled by 1.5. --s 


s€g transform-"translate(200,40)"5 
seg transform-"scale(1.5)"s 
eg fill-"none" strokez"red" stroke-vidth-"3" xs 






eline x1-"0" yl1-"0" x2z-"50" y2z"0" /5 
eline x1-"0" yl-"0" x2-"0" y2z-"50" /5 
x/g” 


etext xe"0" y-"0" font-sizez"20" font-family-"Verdana" fill-"blue" xs 
ABC (scale) 
ce/text- 
x/g” 
x/g” 
x/svg” 


ə 
.o 
ə 
(ari 
KL” 
- 
o 
E 
E 
(ə) Example RotateScale 
0 

cc 

Ə 

- 





Example Skevr defines tvvo coordinate systems vvhich are skevved relative to the origin coordinate system. 


c?xml versionz"1.0" standalone-"no"?z 
€ DOCTYPE svg PUBLİC "-//03C//DTD SVG 1.1//EN" 
"http: / /uu/v .v3.org/Graphics/SVG/1.1/DTD/svg11.dtd"x 
s€svg vidth-"400px" height-"120px" version-"1.1" 
xmlnsze"http: / /v/v/ .v(3..0T9/2000/svg"z 
edescsExample Skev - Shov effects of skevX and skev/Yx/desc” 
sg fill-"none" strokeze"black" stroke-vidthe"3" 5 
c1-- Drav the axes of the original coordinate system --xs 
eline x1z"0" yl-"1.5" x2-"400" y2z"1.5" /s 
eline x1z"1.5" yl-"0" x2-"1.5" y2-"120" /5 
x/g” 
c1-- Establish a nev coordinate system vhose origin is at (30,30) 
in the initial coord. system and vhich is skeved in X by 30 degrees. --x 
sg transform-"translate(30, 30)" 
sg transform-"skevX(30)"5 
eg fill-"none" strokeze"red" stroke-vidth-"3" xs 
eline x1-"0" yl-"0" x2-"50" y2-"0" /s 
eline x1-"0" yl-"0" x2-"0" y2z"50" /5 
x/g” 
etext xz"0" y-"0" font-sizez"20" font-family-"Verdana" fill-"blue" x 
ABC (skevX) 





c/text- 
x/g” 
x/g” 
c1-- Establish a nev coordinate system uvhose origin is at (200,30) 
in the initial coord. system and uvhich is skeved in Y by 30 degrees. --x 


vg transform-"translate (200,30)"5 
vg transform-"skevY(30)"5 
vg fille"none" strokeze"red" stroke-vidthe"3" s 
eline x1e-"0" ylz-"0" x2z"50" y2z"0" /5 
eline x1-"0" yl-"0" x2e-"0" y2z"50" /5 
x/g? 
etext xz"0" y-"0" font-sizez"20" font-family-"Verdana" fill-"blue" xs 
ABC (skev/Y) 
x/texte 
x/g” 
x/g” 
x/ svg” 


Example Skevv 





SAENÜAN 


Mathematically, all transformations can be represented as 3x3 transformation matrices of the follovving form: 
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Since only six values are used in the above 3x3 matrix, a transformation matrix is also expressed as a vector: 


İabcdefl. 


Transformations map coordinates and lengths from a nevv coordinate system into a previous coordinate sys- 


tem: 





XorevCoord Sys a c € Ə XnevrCoordSys 
Y prevCoord Sys muzi b d f YnevrCoordSys 
1 001 1 


Simple transformations are represented in matrix form as follovvs: 


e “Translation is equivalent to the matrix 


1 0 tx 
0-1 0y 
001 


or İ100 0 1 tx tyl, vrhere fx and fy are the distances to translate coordinates in X and Y, respectively. 


e Scaling is equivalent to the matrix 


sx 0 0 
0 sy 0 
001 


or İsx 0 0 sy 0 01. One unit in the Xand Y directions in the nevv coordinate system equals sx and sy units in 
the previous coordinate system, respectively. 


e Rotation about the origin is equivalent to the matrix 


cos(a) -sin(a) 0 
sin(a) cos(a) 0 
0 0 1 


or İcos(a) sin(a) -sin(a) cos(a) 0 01, vvhich has the effect of rotating the coordinate system axes by angle a. 
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e A skevv transformation along the x-axis is equivalent to the matrix 


1 tan(a) 0 
0 1 0 
0 0 i 


or İ100 tan(a) 1 0 01, vvhich has the effect of skevving X coordinates by angle a. 


e A skevv transformation along the y-axis is equivalent to the matrix 


oo 


or İ1 tan(a) 0 1 0 01, vvhich has the effect of skevring Y coordinates by angle a. 


7.5 Nested transformations 


Transformations can be nested to any level, The effect of nested transformations is to post-multiply (i.e., concat- 
enate) the subsequent transformation matrices onto previously defined transformations: 


Xporev İ —. 1 31Ci€i ao? €2 Xcurr 
Yprev Sum bidi fı ı bədə f, ı Ycurr 
1 001 001 1 


For each given element, the accumulation of all transformations that have been defined on the given element 
and all of its ancestors up to and including the element that established the current vievvport (usually, the “svg” 
element vvhich is the most immediate ancestor to the given element) is called the current transformation matrix 
or CTM. The CTM thus represents the mapping of current user coordinates to vievvport coordinates: 


— İ ö:C: €, a, C, €? an Cı en 
CTM — İtbidi, İİ b,d,f,İ“  İ bıduf, 
001 001 ..c 001 


Xyievvport m Xuserspace 
Yutevrport nm "” İİ Yuserspace 


1 1 


Example Nested illustrates nested transformations. 


c?xml versionz"1.0" standalonez"no"?z 
€ DOCTYPE svg PUBLİC "-//V3C//DTD SVG 1.1//EN" 
"http: / /vvv/.vV3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
x€svg vidth-"400px" height-"150px" version-"1.1" 
xmlnsz"http: / /vuv/..v(3.0T9/2000/svg"z 
edescəsExample Nested - Nested transformations-/desc” 
sg fill-"none" strokeze"black" stroke-vidth-"3" 5 
c1-- Drav the axes of the original coordinate system --x 
eline x1-"0" yl-"1.5" x2-"400" y2-"1.5" /5 
eline x1-"1.5" ylz"0" x2-"1.5" y2-"150" /5 
x/g” 
c1-- First, a translate --- 
sg transform-"translate(50,90)"5 
eg fill-"none" strokez"red" stroke-vidthz"3" s 
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eline x1z-"0" y1-"0" x2-"50" y2z"0" /s 
eline x1z-"0" y1-"0" x2-"0" y2z"50" /5 

x/g” 

€text xe"0" ye"0" font-sizeze"16" font-familye"Verdana" x 
....Translate(1) 

e/textə- 

c1-- Second, a rotate --s 


s€g transforme" rotate(-45)"5 
eg fill-"none" strokez"green" stroke-vidth-"3" s 
eline x1-"0" ylz"0" x2-"50" y2z"0" /s5 
eline x1-"0" yl1-"0" x2-"0" y2-"50" /5 





x/g” 

etext xe"0" y-"0" font-sizez"16" font-family-"Verdana" x 
.......Rotate(2) 

c/text- 


c1-- Third, another translate --x 
sg transform-"translate(130, 160)" 
eg fill-"none" strokez"blue" stroke-vidthe"3" s 
eline x1-"0" y1-"0" x2-"50" y2-"0" /5 
eline x1-"0" yl-"0" x2-"0" y2z"50" /5 


x/g” 
etext xe"0" y-"0" font-sizez"16" font-family-"Verdana" x 
....Translate(3) 
c/text- 
x/g” 
x/g” 
x/g” 
s/ svg” 


Example Nested 





o - 
s” s? 


slate(1) 


m the example above, the CTM vvithin the third nested transformation (i.e., the transform-"translate(130,160)") 


consists of the concatenation of the three transformations, as follovvs: 


CTM maq translate(50,90), rotate(-45), translate( 130,160) 
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— İ1 050 .707 .707 0 0 130 

— 10 190 “707707 0 1 160 
0 0 001 

— İ.707 .707 255.03 

— 707 707 111.21 


0 0 1 


Xinitial Xuserspace 
7. 755 





7.6 The “transform” attribute 


The value of the “transform” attribute is a -transform-list-, vvhich is defined as a list of transform definitions, 
vvhich are applied in the order provided. The individual transform definitions are separated by vvhitespace and/or 
a comma. The available types of transform definitions include: 


e matrix(-as -bs -cs -də ces -f5), vvhich speciftes a transformation in the form of a transformation matrix of 


six values. matrix(a,b,c,d,e,f) is equivalent to applying the transformation matrix la b cd e fl. 


e translate(-tx” F-ty”1), vvhich speciftes a translation by fx and £y. If -£yx is not provided, it is assumed to be 


ZE€TO. 


e scale(-sxə- İ-sy1), vvhich speciftes a scale operation by sx and sy. If -sy” is not provided, it is assumed to be 


equal to -sxə. 


e Totate(-rotate-angle” F-exs -ey”1), vvhich speciftes a rotation by -rotate-angle” degrees about a given point. 
If optional parameters -ex” and -ey” are not supplied, the rotate is about the origin of the current user co- 
ordinate system. The operation corresponds to the matrix Fcos(a) sin(a) -sin(a) cos(a) 0 01. 
If optional parameters -exs and -eys are supplied, the rotate is about the point (ex, ey). The operation repres- 


ents the equivalent of the follovving specification: translate(xexs, -ey”) rotate(-rotate-angle”) translate(--exx, 
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-xCy”). 
e skev/X(-skevv-angle”), vvhich speciftes a skevv transformation along the x-axis. 


e skev/Y(-skevv-angle”), vvhich speciftes a skevv transformation along the y-axis. 


AİI numeric values are -numberss. 
If a İist of transforms is provided, then the net effect is as if each transform had been specifted separately in 


the order provided. For example, 


xg transform-"translate(-10,-20) scale(2) rotate(45) translate(5,10)"5 
c1-- graphics elements go here --x 
c/gz 


is functionally equivalent to: 


€g transform-"translate (-10, -20) "5 
€g transform-"scale(2)"- 
x€g transformze"rotate(45)"s 
€g transform-"translate(5,10)"- 
c1-- graphics elements go here --x 
x/gz 
x/gz 
x/gz 
x/gz 


"The “transform” attribute is applied to an element before processing any other coordinate or length values supplied 
for that element. In the element 


xrect xe"10" ye"10" vidthe-"20" height-"20" transform-"scale(2)"/s 


the x, y, vvidth and height values are processed after the current coordinate system has been scaled uniformly by 
a factor of 2 by the “transform” attribute. Attributes x, y, vvidth and height (and any other attributes or properties) 
are treated as values in the nevv user coordinate system, not the previous user coordinate system. Thus, the above 
“rect” element is functionally equivalent to: 

€g transform-"scale(2)"- 


crect xe"10" y-"10" vidth-"20" heighte"20"/5 
x/gz 


The follovving is the Backus-Naur Form (BNF) for values for the “transform” attribute. The follovving notation is 


used: 


e “: 0 or more 
e “1 OT more 
e 2:0o0r1 

e (): grouping 


e İ: separates alternatives 
e double quotes surround literals 


transform-list: 

vsp” transforms? vsp” 

transforms: 

transform 

İ transform comma-v/sp- transforms 

transform: 

matrix 

İ translate 

İ scale 

İ rotate 

İ skevX 

İ skevY 

matrix: 

"matrix" vsp” "(" vsp” 
number comma-vsp 
number comma-vsp 
number comma-vsp 
number comma-vsp 
number comma-vsp 
number vsp” ")" 
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translate: 

"translate" usp” "(" “sp” number ( comma-v/sp number )? vsp” ")" 
scale: 

"scale" vsp” "(" vsp” number ( comma-v/sp number )? vsp” ")" 
rotate: 

"rotate" vsp” "(" vsp” number ( comma-vvsp number comma-visp number )? vsp” ")" 
skevX: 

"skevX" vsp” "(" sp” number vsp” ")" 
skevY: 

"skevY" vsp” "(" sp” number vsp” ")" 
number: 


sign? integer-constant 

İ sign? floating-point-constant 
comma -v/sp: 

(vSp comma? v/sp”) 1 (comma v/sp”) 
comma : 
integer-constant: 

digit-sequence 
floating-point-constant: 

Tfractional-constant exponent? 

İ digit-sequence exponent 
Tractional-constant: 


digit-sequence? "." digit-sequence 
İ digit-sequence "." 
exponent: 
( "e" 1 "E" ) sign? digit-sequence 
sign: 
"." İ " “ " 
digit-sequence: 
digit 
İ digit digit-sequence 
digit: 


"" l "lı" l "2" l "3" l "4" l "a l "6" l "r l "gün l "o" 


V/Sp: 
(4x20 1 4”x9 1 £xD 1 £xA) 


For the “ransform:” attribute: 
Animatable: yes. 
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See the “animateTransform” element for information on animating transformations. 


7.7 The “vievvBox” attribute 


İt is often desirable to specify that a given set of graphics stretch to fit a particular container element. The “vievvBox” 
attribute provides this capability. 

AlI elements that establish a nevv vievvport (see elements that establish vievvports), plus the “marker”, “pattern” 
and “vievr” elements have attribute “vievvBox”. The value of the “vievvBox” attribute is a list of four numbers -min-x”, 





emin-yx, evridth” and -height”, separated by vvhitespace and/or a comma, vvhich specify a rectangle in user space 
vvhich should be mapped to the bounds of the vievvport established by the given element, taking into account at- 
tribute “preserveAspectRatio”. If specifted, an additional transformation is applied to all descendants of the given 
element to achieve the specifted effect. 

A negative value for -vvidth” or -heightə- is an error (see Error processing). A value of zero disables rendering 
of the element. 

Example VievvBox illustrates the use of the “vievvBox” attribute on the outermost svg element to specify that 
the SVG content should stretch to fit bounds of the vievvport. 


c?xml versionze"1.0" standalonez"no"?s 
x DOCTYPE svg PUBLİC "-//03C//DTD SVG 1.1//EN" 
"http: / /vvvv .v3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
€svg vidth-"300px" height-"200px" versionze"1.1" 
vievBoxz"0 0 1500 1000" preserveAspectRatioz"none" 
xmlnse"http: / /uvv/.v3.org/2000/svg"z 
edescxExample VievBox - uses the vievBox 
attribute to automatically create an initial user coordinate 
system vhich causes the graphic to scale to fit into the 
vievport no matter vhat size the vieuvport is.c/desc” 
c1-- This rectangle goes from (0,0) to (1500, 1000) in user space. 
Because of the vievBox attribute above, 
the rectangle vill end up filling the entire area 
reserved for the SVG content. --x 
crect xze"0" y-"0" vidth-"1500" height-"1000" 
fill-"yellov" strokez"blue" stroke-vidthe"12" /s 
c1-- A large, red triangle -- 
cpath fill-"red" de"M 750,100 L 250,900 L 1250,900 z"/s 
c1-- A text string that spans most of the vievport --x 
etext xe"100" y-"600" font-sizez"200" font-family-"Verdana" x 
Stretch to fit 
c/text- 
c/ svg” 


Example VievvBox 


Rendered into Rendered into 
vievvport vvith vievvport vvith 
vvidth-300px, vvidth-150px, 
height-200px height-200px 
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The effect of the “vievvBox” attribute is that the user agent automatically supplies the appropriate transformation 
matrix to map the specifted rectangle in user space to the bounds of a designated region (often, the vievvport). To 
achieve the effect of the example on the left, vvith vievvport dimensions of 300 by 200 pixels, the user agent needs 
to automatically insert a transformation vvhich scales both X and Y by 0.2. The effect is equivalent to having a 
vievvport of size 300px by 200px and the follovving supplemental transformation in the document, as follovvs: 


c?xml versionze"1.0" standalonez"no"?s 
x DOCTYPE svg PUBLİC "-//03C//DTD SVG 1.1//EN" 
"http: / /vvvv .v3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
€svg vidth-"300px" height-"200px" versionze"1.1" 
xmlnse"http:/ /vvu/.v3.org/2000/svg"z 
€g transform-"scale(0.2)"- 
c1-- Rest of document goes here --xs 
c/g 
c/ svgx 


To achieve the effect of the example on the right, vvith vievvport dimensions of 150 by 200 pixels, the user agent 
needs to automatically insert a transformation vvhich scales X by 0.1 and Y by 0.2. The effect is equivalent to hav- 
ing a vievrport of size 150px by 200px and the follovving supplemental transformation in the document, as follovvs: 


c?xml versionze"1.0" standalonez"no"?s 
x DOCTYPE svg PUBLİC "-//03C//DTD SVG 1.1//EN" 
"http://vuv.v3.org/Graphics/SVG/1.1/DTD/svg11.dtd"- 
€svg vidth-"150px" height-"200px" versionze"1.1" 
xmlnse"http://vvu/.v3.org/2000/svg"z 
€g transform-"scale(0.1 0.2)"- 
c1-- Rest of document goes here --xs 
c/g? 
c/ vg” 
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(Note: in some cases the user agent vvill need to supply a translate transformation in addition to a scale trans- 
formation. For example, on an outermost svg element, a translate transformation vvill be needed if the “vievvBox” 
attributes specifies values other than zero for -min-x” or -min-y?.) 

Unlike the “transform” attribute (see effect of the “transform” on sibling attributes), the automatic transforma- 
tion that is created due to a “vievvBox” does not affect the “x”, “y”, “vidth” and “height” attributes (or in the case of the 
“marker” element, the “markerVVidth” and “markerHeight” attributes) on the element vvith the “vievvBox” attribute. 
Thus, in the example above vvhich shovvs an “svg” element vvhich has attributes “vridth”, “height” and “vievBox”, the 
“vvidih” and “height” attributes represent values in the coordinate system that exists before the “vievvBox” transform- 
ation is applied. On the other hand, like the “transform” attribute, it does establish a nevv coordinate system for all 
other attributes and for descendant elements. 

For the “vievvBox” attribute: 

Animatable: yes. 


7.8 The “preserveAspectRatio” attribute 


In some cases, typically vvhen using the “vievrBox” attribute, it is desirable that the graphics stretch to fit non-uni- 
formly to take up the entire vievvport. In other cases, it is desirable that uniform scaling be used for the purposes 
of preserving the aspect ratio of the graphics. 

Attribute preserveAspectRatio-"Ideferl -align”- F-meetOrSlice-1", vvhich is available for all elements that es- 
tablish a nevv vievvport (see elements that establish vievvports), plus the “image”, “marker”, “pattern” and “vievv” ele- 
ments, indicates vvhether or not to force uniform scaling. 

For elements that establish a nevv vievvport (see elements that establish vievvports), plus the “marker”, “pattern” 
and “vievr” elements, “preserveAspectRatio” only applies vvhen a value has been provided for “vievrBox” on the same 
element. For these elements, if attribute “vievvBox” is not provided, then "preserveAspectRatio” is ignored. 

For “image” elements, “preserveAspectRatio” indicates hovv referenced images should be fitted vvith respect to 
the reference rectangle and vvhether the aspect ratio of the referenced image should be preserved vvith respect to 
the current user coordinate system. 

If the value of “preserveAspectRatio” on an “image” element starts vvith "defer" then the value of the "pre- 
serveAspectRatio” attribute on the referenced content if present should be used. If the referenced content lacks a 
value for “preserveAspectRatio” then the “preserveAspectRatio” attribute should be processed as normal (ignoring 
"defer"). For “preserveAspectRatio” on all other elements the "defer" portion of the attribute is ignored. 

The -align” parameter indicates vvhether to force uniform scaling and, if so, the alignment method to use in 
case the aspect ratio of the “vievvBox” doesn"t match the aspect ratio of the vievvport. The -align” parameter must 


be one of the follovving strings: 


e none - Do not force uniform scaling. Scale the graphic content of the given element non-uniformly if neces- 
sary such that the elements bounding box exactly matches the vievvport rectangle. 
(Note: if -aligns is none, then the optional -meetOrSlices value is ignored.) 
e xMinYMin - Force uniform scaling. 
Align the -min-x? of the elements “vievvBox” vvith the smallest X value of the vievvport. 
Align the -min-y”- of the elements “vievvBox” vvith the smallest Y value of the vievvport. 


ə xMidYMin - Force uniform scaling. 
Align the midpoint X value of the element"s “vievvBox” vvith the midpoint X value of the vievvport. 
Align the -min-y”- of the elements “vievvBox” vvith the smallest Y value of the vievvport. 

e xMaxYMin - Force uniform scaling. 
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Align the -min-x?---vvidths- of the elements “vievvBox” vvith the maximum X value of the vievvport. 

Align the -min-y” of the elements “vievvBox” vvith the smallest Y value of the vievvport. 
e xMinYMid - Force uniform scaling. 

Align the -min-x? of the elements “vievvBox” vvith the smallest X value of the vievvport. 

Align the midpoint Y value of the elements “vievvBox” vvith the midpoint Y value of the vievvport. 
e— xMidYMid (the default) - Force uniform scaling. 

Align the midpoint X value of the elements “vievrBox” vvith the midpoint X value of the vievvport. 

Align the midpoint Y value of the elements “vievvBox” vvith the midpoint Y value of the vievvport. 
e xMaxYMid - Force uniform scaling. 





Align the -min-x?---vvidths- of the elements “vievrBox” vvith the maximum X value of the vievvport. 
Align the midpoint Y value of the elements “vievvBox” vvith the midpoint Y value of the vievvport. 
e xMinYMax - Force uniform scaling. 
Align the -min-x? of the elements “vievvBox” vvith the smallest X value of the vievvport. 
Align the -min-y”--heighis of the elements “vievvBox” vvith the maximum Y value of the vievvport. 
e xMidYMax - Force uniform scaling. 
Align the midpoint X value of the elements “vievvBox” vvith the midpoint X value of the vievvport. 
Align the -min-y”--heighis of the elements “vievvBox” vvith the maximum Y value of the vievvport. 
e xMaxYMax - Force uniform scaling. 
Align the -min-x?---vvidths- of the elements “vievrBox” vvith the maximum X value of the vievvport. 
Align the -min-y”--heights of the elements “vievvBox” vvith the maximum Y value of the vievvport. 


The -meetOrSlice”- parameter is optional and, if provided, is separated from the -alignə value by one or more 
spaces and then must be one of the follovving strings: 


e meet (the default) - Scale the graphic such that: 
o aspect ratio is preserved 
o the entire “viev”Box” is visible vvithin the vievvport 
o the “vievvBox” is scaled up as much as possible, vvhile still meeting the other criteria 
In this case, if the aspect ratio of the graphic does not match the vievrport, some of the vievvport vvill extend 
beyond the bounds of the “vievrBox” (i.e., the area into vvhich the “vievvBox” vvill dravv vvill be smaller than the 
VieVVpoTt). 
e slice - Scale the graphic such that: 
o aspect ratio is preserved 
o the entire vievvport is covered by the “vievrBox” 
o the “vievvBox” is scaled dovvn as much as possible, vvhile still meeting the other criteria 
m this case, if the aspect ratio of the “vievvBox” does not match the vievvport, some of the “vievrBox” vvill 
extend beyond the bounds of the vievvport (i.e., the area into vvhich the “viev,Box” vvill dravv is larger than the 


Vievvport). 


Example PreserveAspectRatio illustrates the various options on “preserveAspectRatio”. To save space, XML entities 
have been defined for the three repeated graphic obfects, the rectangle vvith the smile inside and the outlines of 
the tvvo rectangles vvhich have the same dimensions as the target vievvports. The example creates several nevv 
vievvports by including “svg” sub-elements embedded inside the outermost svg element (see Establishing a nevv 
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vievvport). 


c?xml version-"1.0" encoding-"UTF-8"75 

x DOCTYPE svg PUBLİC "-//0/3C//DTD SVG 1.1//EN" 
"http://uvv/.v3.org/Graphics/SVG/1.1/DTD/svg11.dtd" 

I -IENTİTY Smile " 

vrect xe",5" ye".5" vidth-"29" height-"39" fill-"black" strokez" red"/5 

€g transforme" translate(0, 5)" 

ecircle cxz"15" cyz"15" rz"10" fille"yellov"/x 

ecircle cxz"12" cye"12" rz"1.5" fill-e"black"/x 

ecircle cxz"17" cye"12" rz"1.5" fille"black"/5 

cepath de"M 10 19 A 8 8 0 0 0 20 19" strokez"black" stroke-vidthe"2"/” 

x/g” 

x 

€1ENTİTY Vieuvport1 "crect xe",5" ye".5" vidthz-"49" heighte"29" 

fill-"none" strokez"blue"/s"s 

€1ENTITY Vieuvport2 "crect xse",5" ye".5" vidth-"29" heighte"59" 

fill-"none" strokez"blue"/s"s 

1- 





c€svg vidth-"450px" height-"300px" versione"1.1" 
xmlnsz"http: / /vuv/..v(3.0T9/2000/svg"z 
cdescsExample PreserveAspectRatio - illustrates preserveAspectRatio attribute-c/desc” 
crect xe"1" y-"1" vidth-"448" height-"298" 
fill-"none" strokez"blue"/x 
sg font-sizez"9"s 
€text xe"10" y-"30"5SVG to fitc/texte 
€g transform-"translate(20,40) "s8Smile:-c/g” 
etext xe"10" y-"110"-Vievport 1-/text” 
s€g transform-"translate(10, 120) "28Vievport1:-/g” 
etext xe"10" y-"180"-Vievport 2-c/text” 
s€g transform-"translate(20, 190) "28Vievport2:x/g” 


€g id-"meet-group-1" transforme"translate(100, 60)" 
etext xe"0" yz"-30"5--------------- meet --------------- c/text- 
s€goctext yz"-10"sxMin”c/textsSVievport1, 
€SVg preserveAspectRatioe"xMinYMin meet" vievBoxz"0 0 30 40" 
vidth-"50" height-"30"-8Smile,-/svg”c/gx 
€g transforme"translate(70,0)"cctext ye"-10"-xMid”-/textsSVieuvport1, 
€SVg preserveAspectRatioe"xMidYMid meet" vievBoxz"0 0 30 40" 
vidth-"50" height-"30"x8Smile,-/svgs-/g” 
€g transform-"translate(0,70)"c-ctext ye"-10"-xMax”c/textsSVievport1, 
€SVg preserveAspectRatioz"xMaxYMax meet" vievBoxz"0 0 30 40" 
vidth-"50" height-"30"x8Smile,-/svgo-/gx” 
x/g” 


vg id-"meet-group-2" transform-"translate(250, 60)" 
etext xe"0" yz"-30"5---------- meet ---------- e/textə- 
€goctext ye"-10"5“YMin-/textoSVievport2, 
€SVg preserveAspectRatioe"xMinYMin meet" vievBoxz"0 0 30 40" 
vidth-"30" height-"60"x8Smile,-/svg”-/g” 
€g transforme"translate(50, 0)"cctext ye"-10"5“YMid-/textoSVievport2, 
€SVg preserveAspectRatioe"xMidYMid meet" vievBoxz"0 0 30 40" 
vidth-"30" height-"60"-8Smile,-/svgec/gx” 
€g transform-"translate(100, 0)"cctext ye"-10"-“YMax-/textsSVievport2, 
€SVg preserveAspectRatioze"xMaxYMax meet" vievBoxz"0 0 30 40" 
vidth-"30" height-"60"-8Smile,-/svgrc/gx 
x/g” 


€g ide"slice-group-1" transform-"translate(100, 220)"- 
etext xe"0" yz"-30"5---------- slice ---------- c/textə- 
€goctext yz"-10"sxMin”c/textsSVievport2, 
€SVg preserveAspectRatioe"xMinYMin slice" vieuvBoxze"0 0 30 40" 
vidth-"30" height-"60"-8Smile,-/svg”c/gx” 
€g transforme"translate(50,0)"cctext ye"-10"-xMid”-/textsSVievport2, 
€SVg preserveAspectRatioe"xMidYMid slice" vieuvBoxe"0 0 30 40" 
vidth-"30" height-"60"x8Smile,-/svg”-/g” 
€g transforme"translate(100,0)"c-ctext ye"-10"xxMax”-c/textsSVievport2, 
€SVg preserveAspectRatioe"xMaxYMax slice" vieuvBoxe"0 0 30 40" 


vidth-"30" height-"60"58Smile,-/svgrc/gx” 
x/g” 


€g ide"slice-group-2" transform-"translate(250, 220)" 
etext xe"0" yz"-30"5--------------- slice --------------- c/text- 
€goctext ye"-10"5“YMinc/textsSVievport1, 
€SVg preserveAspectRatioe"xMinYMin slice" vievBoxe"0 0 30 40" 
vidth-"50" height-"30"-8Smile,:-/svgec/gx” 
€g transforme"translate(70,0)"cctext ye"-10"5“YMid-/textsSVievport1, 
€SVg preserveAspectRatioe"xMidYMid slice" vieuvBoxe"0 0 30 40" 
vidth-"50" height-"30"-8Smile,-/svgrc/gx” 
€g transforme"translate(140,0)"c-ctext ye"-10"x“YMaxc/textsSVieuport1, 
€SVg preserveAspectRatioe"xMaxYMax slice" vievBoxe"0 0 30 40" 
vidth-"50" height-"30"-8Smile,-/svgec/gx 
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x/g” 
c/g” 
s/ svg” 


Example PreserveAspectRatio 





For the “preserveAspectRatio” attribute: 
Animatable: yes. 


7.9 Establishing a nevv vievvport 


At any point in an SVG dravving, you can establish a nevv vievvport into vvhich all contained graphics is dravvn by 
including an “svg” element inside SVG content. By establishing a nevv vievvport, you also implicitly establish a nevv 
vievvport coordinate system, a nevv user coordinate system, and, potentially, a nevv clipping path (see the defini- 
tion of the “overflovv” property). Additionally, there is a nevv meaning for percentage units defined to be relative to 
the current vievvport since a nevv vievvport has been established (see Units). 

The bounds of the nevv vievvport are defined by the “x”, “y”, “vvidth” and “height” attributes on the element es- 
tablishing the nevv vievvport, such as an “svg” element. Both the nevv vievvport coordinate system and the nevv user 
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coordinate system have their origins at (/x”, “y”), vvhere “x” and “y” represent the value of the corresponding attrib- 

utes on the element establishing the vievvport. The orientation of the nevv vievvport coordinate system and the nevv 

user coordinate system correspond to the orientation of the current user coordinate system for the element estab- 

lishing the vievrport. A single unit in the nevv vievvport coordinate system and the nevv user coordinate system are 

the same size as a single unit in the current user coordinate system for the element establishing the vievvport. 
Here is an example: 


x?xml versionze"1.0" standalonez"no"?s 
x DOCTYPE svg PUBLİC "-//03C//DTD SVG 1.1//EN" 
"http: // /vvvv .v3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
€svg vidth-"4in" height-"3in" version-"1.1" 
xmlnse"http:/ /uvuv.v3.0rg/2000/svg"z 
cdescsThis SVG draving embeds another one, 
thus establishing a nev vievport 
xc/descə” 
c1-- The folloving statement establishing a nev vievport 
and renders SVG draving B into that vievport --xs 
x€SVg xze"258" yz"258" vidth-"508" height-"508"5 
c1-- draving B goes here --s 
x/ svg” 
x/ svg” 


For an extensive example of creating nevv vievvports, see Example PreserveAspectRatio. 
The follovving elements establish nevv vievvporis: 


e The “svg” element 

e A “symbol” element define nevvr vievvports vvhenever they are instanced by a “use” element. 

e An “image” element that references an SVG file vvill result in the establishment of a temporary nevv vievvport 
since the referenced resource by definition vvill have an “svg” element. 

e A “foreignObiect” element creates a nevv vievvport for rendering the content that is vvithin the element. 


VVhether a nevv vievvport also establishes a nevv additional clipping path is determined by the value of the “over- 
flovr” property on the element that establishes the nevv vievvport. If a clipping path is created to correspond to 
the nevv vievvport, the clipping path"s geometry is determined by the value of the “clip” property. Also, see Clip to 


vievvport vs. clip to “vievvBox”. 


7.10 Units 


AII coordinates and lengths in SVG can be specifted vvith or vvithout a unit identifler. 
VVhen a coordinate or length value is a number vvithout a unit identifter (e.g., "25"), then the given coordinate 
or length is assumed to be in user units (i.e., a value in the current user coordinate system). For example: 


e€text font-sizeze"50"sText size is 50 user unitsc/text- 


Alternatively, a coordinate or length value can be expressed as a number follovved by a unit identifter (e.g., "25em" 
or "15em"). (Note that CSS defined properties used in a CSS style sheet or the “style” attribute require units for non- 
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zero lengths, see SVG"s styling properties.) The list of unit identifters in SVG matches the list of unit identifters in 
CSS: em, ex, px, pt, pc, em, mm and in. The -length” type can also have a percentage unit identifter. The follovving 
describes hovv the various unit identifters are processed: 


e Asin CSS, the em and exunit identifters are relative to the current font/s fonf-size and x-height, respectively. 
e One px unit is defined to be equal to one user unit. Thus, a length of "5px" is the same as a length of "5". 
Note that at initialization, a user unit in the the initial coordinate system is equivalenced to the parent 
environment"s notion of a px unit. Thus, in the the initial coordinate system, because the user coordinate 
system aligns exactly vvith the parent/s coordinate system, and because often the parent"s coordinate system 
aligns vvith the device pixel grid, "5px" might actually map to 5 devices pixels. Hovvever, if there are any co- 
ordinate system transformation due to the use of “transform” or “vievvBox” attributes, because "5px" maps to 
5 user units and because the coordinate system transformations have resulted in a revised user coordinate 
system, "5px" likely vvill not map to 5 device pixels. As a result, in most circumstances, "px" units vvill not 
map to the device pixel grid. 

e "The other absolute unit identifters from CSS (:.e., pt, pc, em, mm, in) are all defined as an appropriate multiple 
of one px unit (vvhich, according to the previous item, is defined to be equal to one user unit), based on vvhat 
the SVG user agent determines is the size of a px unit (possibly passed from the parent processor or envir- 
onment at initialization time). For example, suppose that the user agent can determine from its environment 
that "1px" corresponds to "0.2822222mm" (i.e., 90dpi). Then, for all processing of SVG content: 

o "Ipt" equals "1.25px" (and therefore 1.25 user units) 

o "pe" equals "15px" (and therefore 15 user units) 

o "1mm" vvould be "3.543307px" (3.543307 user units) 

o "1em" equals "35.43307px" (and therefore 35.43307 user units) 
o "lin" equals "90px" (and therefore 90 user units) 


Note that use of px units or any other absolute unit identifters can cause inconsistent visual results on different 
vievving environments since the size of "1px" may map to a different number of user units on different systems, 
thus, absolute units identifters are only recommended for the “vidith” and the “height” on and situations vvhere the 
content contains no transformations and it is desirable to specify values relative to the device pixel grid or to a 
particular real vvorld unit size. 

For percentage values that are defined to be relative to the size of vievvport: 


e For any x-coordinate value or vvidth value expressed as a percentage of the vievrport, the value to use is the 
specifted percentage of the aciual-vvidth in user units for the nearest containing vievvport, vvhere acfual-vidth 
is the vvidth dimension of the vievvport element vvithin the user coordinate system for the vievvport element. 

e For any y-coordinate value or height value expressed as a percentage of the vievrport, the value to use is 
the specified percentage of the acfual-height in user units for the nearest containing vievvport, vvhere acfual- 
height is the height dimension of the vievvport element vvithin the user coordinate system for the vievvport 
element. 

e For any other length value expressed as a percentage of the vievvport, the percentage is calculated as the spe- 
cifled percentage of sqrt((actual-ıvidth)”“2 4 (actual-height)””2) )/sqrt(2). 
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Example Ünits belovv illustrates some of the processing rules for different types of units. 


c?xml versionz"1.0" standalone-"no"?5 
x DOCTYPE svg PUBLİC "-//V3C//DTD SVG 1.1//EN" 
"http: / /vvv/.vV3.org/Graphics/SVG/1.1/DTD/svg11.dtd"s 
€svg vidth-"400px" height-"200px" vievBoxz"0 0 4000 2000" 
xmlnse"http://vuv/.v3.0rg/2000/svg" versionz"1.1"5 
etitlesExample Unitsc/titles 
edescslllustrates various units options-c/desc” 


c1-- Frame the picture --s 
crect xe"5" ye"5" vidth-"3990" height-"1990" 
fill-"none" strokez"blue" stroke-vidth-"10"/5 


eg fille"blue" strokeze"red" font-family-"Verdana" font-sizez"150"- 

c1-- Absolute unit specifiers --s 

€g transforme"translate(400,0)"- 
etext xze"-50" y-"300" fill-"black" strokez"none"sAbs. units:c/textə- 
crect xe"0" yz"400" vidth-"4in" height-"2in" stroke-vidthe".4in"/x 
crect xe"0" yz"750" vidth-"384" height-"192" stroke-vidth-"38.4"/- 
s€g transform-"scale(2)"s 

crect xe"0" yz"600" vidth-"4in" height-"2in" stroke-vidth-".4in"/” 

c/g” 

c/g” 








c1-- Relative unit specifiers --x 
sg transforme"translate(1600, 0)" 
etext xze"-50" y-"300" fill-"black" strokez"none"sRel. units:-c/textə- 
crect xe"0" yz"400" vidth-"2.5em" height-"1.25em" stroke-vidthze" .25em"/” 
crect xe"0" yz"750" vidth-"375" height-"187.5" stroke-vidth-"37.5"/ 
s€g transform-"scale(2)"s 
crect xze"0" yz"600" vidth-"2.5em" height-"1.25em" stroke-vidthz" .25em"/x 
c/g” 
x/g” 


c1-- Percentages --x 
€g transforme"translate (2800, 0)" 
etext xze"-50" y-"300" fill-"black" strokez"none"sPercentages:-c/text- 
crect xe"0" yz"400" vidth-"1085" height-"108" stroke-vidthe"185"/5 
crect xe"0" yz"750" vidth-"400" height-"200" stroke-vidth-"31.62"/5 
sg transform-"scale(2)"s 
crect xe"0" yz"600" vidth-"108" height-"108" stroke-vidthe"18"/5 








c/g” 
x/g” 
x/g” 
c/ svg” 
Example Units 
Abs. units: Rel. units: Percentages: 


"The three rectangles on the left demonstrate the use of one of the absolute unit identifiers, the "in" unit (inch). The 
reference image above vvas generated on a 9edpi system (i.e., 1 inch - 96 pixels). Therefore, the topmost rectangle, 
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vvhich is specifted in inches, is exactly the same size as the middle rectangle, vrhich is specifted in user units such 
that there are 96 user units for each corresponding inch in the topmost rectangle. (Note: on systems vvith different 
screen resolutions, the top and middle rectangles vvill likely be rendered at different sizes.) The bottom rectangle 
of the group illustrates vvhat happens vvhen values specifted in inches are scaled. 

The three rectangles in the middle demonstrate the use of one of the relative unit identifters, the "em" unit. 
Because the “font-size” property has been set to 150 on the outermost “g” element, each "em" unit is equal to 150 
user units. The topmost rectangle, vvhich is specifted in "em" units, is exactly the same size as the middle rect- 
angle, vvhich is specifded in user units such that there are 150 user units for each corresponding "em" unit in the 
topmost rectangle. The bottom rectangle of the group illustrates vvhat happens vvhen values specifted in "em" units 
are scaled. 

The three rectangles on the right demonstrate the use of percentages. Note that the vvidth and height of the 
vievvport in the user coordinate system for the vievvport element (in this case, the outermost svg element) are 4000 
and 2000, respectively, because processing the “viev/Box” attribute results in a transformed user coordinate system. 
The topmost rectangle, vvhich is specified in percentage units, is exactly the same size as the middle rectangle, 
vvhich is specifted in equivalent user units. In particular, note that the “stroke-vvidth” property in the middle rect- 
angle is set to 177 of the sqrt((actual-ıvidth)”“2 4 (actual-height)””2)) / sqrt(2), vvhich in this case is 
.01”sqrt(400074000--200072000)/sqrt(2), or 31.62. The bottom rectangle of the group illustrates vvhat happens vvhen 
values specifted in percentage units are scaled. 


7.11 Obiect bounding box units 


"The follovving elements offer the option of expressing coordinate values and lengths as fractions (and, in some 
cases, percentages) of the bounding box, by setting a specifted attribute to "obectBoundingBox" on the given ele- 


ment: 
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Element Attribute itisi 


“İlinearGradien “gradientUnits” İndicates that the attributes vvhich specify the gradient vector (“xT”, “YT”, 
“x2”, “y2”) represent fractions or percentages of the bounding box of the 
element to vvhich the gradient is applied. 


“radialGradien” “gradientUnits” İndicates that the attributes vvhich specify the center (“cx”, “cy”), the radius 
(r) and focus (fx”, “fy)) represent fractions or percentages of the 


bounding box of the element to vvhich the gradient is applied. 


“pattern” “patternUnits” İndicates that the attributes vvhich define hovv to tile the pattern (x, “y”, 
“vidth”, “height”) are established using the bounding box of the element to 
vvhich the pattern is applied. 


“pattern” “patternContentUnits” Indicates that the user coordinate system for the contents of the pattern is 
established using the bounding box of the element to vvhich the pattern is 
applied. 

“clipPath” “clipPathUnits” İndicates that the user coordinate system for the contents of the “clipPath” 


element is established using the bounding box of the element to vvhich 
the clipping path is applied. 


“mask” “maskünits” İndicates that the attributes vvhich define the masking region (“x”, “y”, 
“vidth”, “height”) is established using the bounding box of the element to 
vvhich the mask is applied. 


“mask” “maskContentünits” İndicates that the user coordinate system for the contents of the “mask” 
element are established using the bounding box of the element to vvhich 
the mask is applied. 


“filter” “filterUnits” İndicates that the attributes vvhich define the filter effects region (“x”, “y”, 
“vidth”, “height”) represent fractions or percentages of the bounding box of 
the element to vvhich the filter is applied. 


“filter” “primitiveUnits” İndicates that the various length values vvithin the filter primitives 
represent fractions or percentages of the bounding box of the element to 
vvhich the filter is applied. 


m the discussion that follovvs, the term applicable element is the element to vvhich the given effect applies. For 
gradients and patterns, the applicable element is the graphics element vvhich has its “fil” or “stroke” property ref- 
erencing the given gradient or pattern. (See Inheritance of Painting Properties. For special rules concerning text 
elements, see the discussion of obyect bounding box units and text elements.) For clipping paths, masks and filters, 
the applicable element can be either a container element or a graphics element. 
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VVhen keyvvord obyectBoundingBox is used, then the effect is as if a supplemental transformation matrix vvere 
inserted into the list of nested transformation matrices to create a nevv user coordinate system. 

First, the (minx,miny) and (maxx,maxy) coordinates are determined for the applicable element and all of its 
descendants. The values minx, miny, maxx and maxy are determined by computing the maximum extent of the 
shape of the element in X and Y vvith respect to the user coordinate system for the applicable element. The bound- 
ing box is the tightest fitting rectangle aligned vvith the axes of the applicable elements user coordinate system 
that entirely encloses the applicable element and its descendants. The bounding box is computed exclusive of any 
values for clipping, masking, filter effects, opacity and stroke-vvidth. For curved shapes, the bounding box encloses 
all portions of the shape, not iust end points. For “text” elements, for the purposes of the bounding box calculation, 
each giyph is treated as a separate graphics element. The calculations assume that all glyphs occupy the full giyph 
cell. For example, for horizontal text, the caleulations assume that each glyph extends vertically to the full ascent 
and descent values for the font. 

Then, coordinate (0,0) in the nevv user coordinate system is mapped to the (minx,miny) corner of the tight 
bounding box vvithin the user coordinate system of the applicable element and coordinate (1,1) in the nevv user 
coordinate system is mapped to the (maxx,maxy) corner of the tight bounding box of the applicable element. In 
most situations, the follovving transformation matrix produces the correct effect: 


fI (maxx-minx) 0 0 (maxy-miny) minx miny 1 


VVhen percentages are used vvith attributes that define the gradient vector, the pattern tile, the filter region or 
the masking region, a percentage represents the same value as the corresponding decimal value (e.g., 507? means 
the same as 0.5). If percentages are used vvithin the content of a “pattern”, “clipPath”, “mask” or “filter” element, these 
values are treated according to the processing rules for percentages as defined in Units. 

Any numeric value can be specifted for values expressed as a fraction or percentage of obiect bounding box 
units. In particular, fractions less are zero or greater than one and percentages less than 077 or greater than 10072 
can be specifted. 

Keyvvord obiectBoundingBox should not be used vvhen the geometry of the applicable element has no vvidth 
or no height, such as the case of a horizontal or vertical line, even vvhen the line has actual thickness vvhen vievved 
due to having a non-zero stroke vvidth since stroke vvidth is ignored for bounding box calculations. VVhen the geo- 
metry of the applicable element has no vvidth or height and obiectBoundingBox is specifted, then the given effect 
(e.g., a gradient or a filter) vvill be ignored. 


7.12 Intrinsic sizing properties of the vievvport of SVG content 


SVG needs to specify hovv to caleulate some intrinsic sizing properties to enable inclusion vvithin other languages. 
"The intrinsic vvidth and height of the vievvport of SVG content must be determined from the “vvidth” and “height” 
attributes. If either of these are not specifted, a value of "10077" must be assumed. Note: the “vidih” and “heighi” 
attributes are nof fhe same as the CSS vvidth and height properties. Specifically, percentage values do not provide 
an intrinsic viidth or height, and do not indicate a percentage of the containing block. Rather, once the vievvport is 
established, they indicate the portion of the vievvport that is actually covered by image data. 

The intrinsic aspect ratio of the vievvport of SVG content is necessary for example, vvhen including SVG from 
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an “ob/ect” element in HTML styled vvith CSS. Tt is possible (indeed, common) for an SVG graphic to have an in- 
trinsic aspect ratio but not to have an intrinsic vvidth or height. The intrinsic aspect ratio must be calculated based 


upon the follovring rules: 


e "The aspect ratio is caleulated by dividing a vvidth by a height. 

e If the “vidth” and “height” of the rootmost “svg” element are both specifted vvith unit identifters (in, mm, cm, 
Pİ, pc, PX, em, ex) or in user units, then the aspect ratio is calculated from the “vvidth” and “height” attributes 
after resolving both values to user units. 

e If either/both of the “vidih” and “height” of the rootmost “svg” element are in percentage units (or omitted), 
the aspect ratio is calculated from the vvidth and height values of the “vievvBox” specifled for the current SVG 
document fragment. If the “viev/Box” is not correctly specifted, or set to "none", the intrinsic aspect ratio can- 


not be calculated and is considered unspecifted. 
Examples: 
Example: Intrinsic Aspect Ratio 1 


xsvg xmlnsze"http: / /vvv .vV3.org/2000/svg" versione"1.2" baseProfilee"tiny" 
vidth-"10cm" height-"5cm"- 


x/ sVvg” 
In this example the intrinsic aspect ratio of the vievvport is 2:1. The intrinsic vvidth is 10em and the intrinsic height 


is 5cm. 
Example: Intrinsic Aspect Ratio 2 


xsvg xmlnsze"http: / /vvv .v/3.0rg/2000/svg" versione"1.2" baseProfilee"tiny" 
vidth-"1005" height-"505" vievBoxz"0 0 200 200" 


x/ svg” 
In this example the intrinsic aspect ratio of the rootmost vievvport is 1:1. An aspect ratio calculation in this case 


allovvs embedding in an obieet vvithin a containing block that is only constrained in one direction. 
Example: Intrinsic Aspect Ratio 3 


xsvg xmlnsze"http: / /vvv .vV3.0rg/2000/svg" versione"1.2" baseProfilee"tiny" 
vidth-"10cm" vieuvBoxz"0 0 200 200" 


x/ svg” 
In this case the intrinsic aspect ratio is 1:1. 
Example: Intrinsic Aspect Ratio 4 


xsvg xmlnsze"http: / /vvv .v/3.0rg/2000/svg" versione"1.2" baseProfilee"tiny" 
vidth-"758" height-"10cm" vievBoxz"0 0 200 200" 


-/ svg” 


In this example, the intrinsic aspect Tatio is 1:1. 


c 
.o 
5 
İv) 
m") 
(s 
(3) 
z 
E 
ə) 
(ə) 
o 
ad 
. 
s 





7.13 Geographic coordinate systems 


In order to allovv interoperability betvveen SVG content generators and user agents dealing vvith maps encoded in 
SVG, the use of a common metadata definition for deseribing the coordinate system used to generate SVG docu- 
ments is encouraged. 

Such metadata must be added under the “metadata” element of the topmost “svg” element describing the map, 
consisting of an RDF description of the Coordinate Reference System definition used to generate the SVG map 
İRDF-PRİMERİ. Note that the presence of this metadata does not affect the rendering of the SVG in any vvay: it 
merely provides added semantic value for applications that make use of combined maps. 

The definition must be conformant to the XML grammar described in GML 3.2.1, an OpenGiS Standard for 
encoding common CARS data types in XML (GMLİ. Hn order to correctly map the 2-dimensional data used by SVG, 
the CRS must be of subtype ProfectedCRS or Geographic2dCRS. The first axis of the desecribed CRS maps the 
SVG x-axis and the second axis maps the SVG y-axis. 

The main purpose of such metadata is to indicate to the user agent that tvvo or more SVG documents can be 
overlayed or merged into a single document. Obviousiİy, if tvvo maps reference the same Coordinate Reference Sys- 
tem definition and have the same SVG “transform: attribute value then they can be overlayed vvithout reprofecting 
the data. If the maps reference different Coordinate Reference Systems and/or have different SVG “transform” at- 
tribute values, then a specialized cartographic user agent may choose to transform the coordinate data to overlay 
the data. Hovvever, typical SVG user agents are not required to perform these types of transformations, or even 
recognize the metadata. İt is described in this specification so that the connection betvveen geographic coordinate 
systems and the SVG coordinate system is clear. 


7.14 The “svg:transform” attribute 


Attribute definition: 


svg:transform z "-transforms" 1 "none" 


etransform”- 
Speciftes the affine transformation that has been applied to the map data. The syntax is identical to that 
described in The “transform” attribute section. 


none 
Specifies that no supplemental affine transformation has been applied to the map data. Using this value 
has the same meaning as specifying the identity matrix, vvhich in turn is iust the same as not specify- 
ing the “svg:transform” the attribute at all. 


Animatable: no. 


"This attribute describes an optional additional affine transformation that may have been applied during this map- 
ping. This attribute may be added to the OpenGİS “CoordinateReferenceSystem” element. Note that, unlike the 


“transform” attribute, it does not indicate that a transformation is to be applied to the data vvithin the file. Instead, 
it simply describes the transformation that vvas already applied to the data vvhen being encoded in SVG. 

There are three typical uses for the “svg:transform” global attribute. These are described belovv and used in the 
examples. 
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ə Most ProyectedCRS have the north direction represented by positive values of the second axis and conversely 
SVG has a y-dovvn coordinate system. That"s vvhy, in order to follovv the usual vvay to represent a map vvith 
the north at its top, it is recommended for that kind of ProyectedCRS to use the “svg:transform” global attrib- 
ute vvith a "scale(1, -1)" value as in the third example belovv. 

ə Most Geographic2dCRS have the latitude as their first axis rather than the longitude, vvhich means that the 
south-north axis vvould be represented by the x-axis in SVG instead of the usual y-axis. That"s vvhy, in or- 
der to follovv the usual vvay to represent a map vvith the north at its top, it is recommended for that kind of 
Geographie2dCRS to use the “svg:transform” global attribute vvith a "rotate(-90)" value as in the first example 
(vvhile also adding the "scale(1, -1)” as for ProyectedCRS). 

e İn addition, vvhen converting for profiles vvhich place restrictions on precision of real number values, it may 





be useful to add an additional scaling factor to retain good precision for a specific area. VVhen generating an 
SVG document from VVGS84 geographic coordinates (EPGS 4326), vve recommend the use of an additional 
100 times scaling factor corresponding to an “svg:transform” global attribute vvith a Totate(-90) scale(100)" value 
(shovvn in the second example). Different scaling values may be required depending on the particular CRS. 


Belovv is a simple example of the coordinate metadata, vvhich describes the coordinate system used by the docu- 
ment via a URL 


c?xml versionz"1.0"25 
€SsVvg xmlnse"http://vvv/.v3.org/2000/svg" versionze"1.1" 
vidth-"100" height-"100" vievBoxz"0 0 1000 1000" 


edescsAn example that references coordinate data.-/desc” 


xmetadataz 
erdf:RDF xmlns:rdfe"http:/ /vvv.v3.org/ 1999/02/22-rdfT-syntax-nszö" 
xmlns:crse"http:/ /MuM.Ogc.org/crs" 
xmlns:svge"http:/ /uvv.v3.org/2000/svg"z 
erdf:Description rdf:aboutz""s 
c1-- The Coordinate Reference System is described 
through a URI. --z 
ccrs:CoordinateReferenceSystem 
svg:transforme"rotate(-90)" 
rdf:resourcez"http: / /v/v/. example. org/srs/epsg .xml34326"/5 
c/rdf:Descriptionx 
c/ rdf:RDF” 
c/metadataz 


c1-- The actual map content --x 
x/ svg” 


The second example uses a vvell-knovvn identifter to describe the coordinate system. Note that the coordinates 
used in the document have had the supplied transform applied. 


c?xml versionz"1.0"25 
€SVvg xmlnse"http://vuv/.vV3.org/2000/svg" versione"1.1" 
vidth-"100" height-"100" vievBoxz"0 0 1000 1000" 


edescsExample using a vel1 knovn coordinate system.-/desc” 


xmetadatax 
erdf:RDF xmlns:rdfe"http: / /vMMMv..v/3.0rg/ 1999/02/22- rdf-syntax-nsıir" 





xmlns:crse"http:/ /vMM.ogc.org/crs" 
xmlns:svge"http: / /uvv .V3.org/2000/svg"s 
erdf:Description rdf:aboutz""s 
€1-- In case of a vell-knovn Coordinate Reference System 
an "Identifier" is enough to describe the CRS --xs 
ecrs:CoordinateReferenceSystem svg:transform-" rotate(-90) scale(100, 100)"5 
ecrs:1dentifier- 
ccrs:codes4326-/crs:codes 
€Crs:codeSpacesEPS6-/crs : codeSpaces 
ccrs:editions5.2-c/crs:editionx 
cv/crs:1dentifier- 
sc/ crs:CoordinateReferenceSystem- 
c/rdf:Descriptionx 
c/ rdf:RDF” 
c/metadatax 
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c1-- The actual map content --s 
x/svg” 


"The third example defines the coordinate system completely vvithin the SVG document. 


c?xml versionz"1.0"?25 
x€svg xmlnse"http:/ /vvv/.v3.org/2000/svg" versionze"1.1" 
vidth-"100" height-"100" vievBoxz"0 0 1000 1000"5 





cdescsoCoordinate metadata defined vithin the SVG document-/desc” 


xmetadatax 
erdf:RDF xmlns:rdfe"http:/ /vuv.v3.org/ 1999/02/22-rdT-syntax-nsz" 
xmlns:crse"http:/ /uMv.ogc.org/crs" 
xmlns:svge"http: / /uvv .vV3.o0rg/2000/svg"s 
erdf:Description rdf:aboutz""s 
€1-- For other CRS it should be entirely defined --x 
ecrs:CoordinateReferenceSystem svg:transform-"scale(1,-1)"5 
ecrs:NameSet- 
ccrs:namesMercator profection of M6S84-/crs:namez 
c/ crs:NameSet- 
ecrs:ProfectedCRS” 
c1-- The actual definition of the CRS --x 
ecrs:CartesianCoordinateSystem” 
ccrs:dimensionx2c/crs:dimensionx 
ecrs:CoordinateAxis” 
ccrs:axisDirectionsnorth-/crs:axisDirectionx 
ecrs:AngularuUnit- 
ecrs:ldentifier- 
x€crs:codes9108-/crs:codes 
ecrs: codeSpacesEPS6G-/crs : codeSpacex 
€crs:editions5.2c/crs:editionx 
c/crs:1Identifiers 
xe/ crs:AngularUnit- 
c/ crs:CoordinateAxisx 
ecrs:CoordinateAxisx” 
ccrs:axisDirectionseastc/crs:axisDirectionx 
secrs:AngularUnit- 
ecrs:ldentifier- 
s€crs:codes9108-/crs:codes 
€crs: codeSpacesEPS6-/crs : codeSpacex 
€crs:editions5.2c/crs:editionx 
c/crs:Identifiers 
x/ crs:AngularUnit- 
s/crs:CoordinateAxisx 
c/crs:CartesianCoordinateSystem” 
ecrs:CoordinateReferenceSystem- 
c1-- the reference system of that profected system is 
MVGS84 vhich is EPSG 4326 in EPSG codeSpace --x 
ecrs:NameSet- 
ccrs:namexilG6S 84-/crs:namex 
xc/ crs:NameSet- 
ecrs:1dentifier- 
xecrs:codes4326-/crs:codes 
€crs :codeSpacexEPS6-/ crs : codeSpacex 
ccrs:editions5.2c/crs:editionx 
cv/crs:l1dentifier- 
s/ crs:CoordinateReferenceSystem- 
ecrs:CoordinateTransformationDefinitionx 





ccrs:sourceDimensionsx2-/crs:sourceDimensionsx 
c€crs:targetDimensionss2-/crs:targetDimensions” 
ecrs:ParameterizedTransformationx 
ecrs:TransformationMethod” 
c1-- the profection is a Mercator profection uhich is 
EPSG 9805 in EPSG codeSpace --x 
ecrs:NameSet- 
€crs:namesMercator-c/crs:names 
c/ crs:NameSet- 
ecrs:ldentifier- 
scrs: codes9805-/crs:codes 
€crs: codeSpacesEPS6-/crs : codeSpacex 
€crs:editions5.2c/crs:editionx 
c/crs:Identifiers 
ecrs:descriptionsMercator (2SP)c/crs:descriptionx 
sc/crs:TransformationMethod” 
ecrs:Parameterx 
ecrs:NameSet- 
€crs:namesLatitude of 1st standart paralle1-/crs:name- 
c/ crs:NameSet- 
ecrs:ldentifier- 
scrs: codes8823-/crs:codes 
€crs:codeSpacesEPS6G-/crs : codeSpacex 
ecrs:editions5.2c/crs:editionx 
c/crs:1Identifiers 
xcrs:values0-/crs:values 
s/ crs:Parameterx” 
ecrs:Parameterx 
ecrs:NameSet- 
xccrs:namesLongitude of natural origin-/crs:name- 
c/ crs:NameSet- 
ecrs:ldentifier- 
xcrs: codes8802-/crs:codes 
€crs: codeSpacesEPS6-/crs : codeSpacex 
ecrs:editions5.2c/crs:editionx 
c/crs:Identifiers 
ecrs:values0-/crs:values 
s/ crs:Parameterx 
ecrs:Parameterx 
ecrs:NameSet- 
sccrs:namesFalse Easting-/crs:namex 
se/ crs:NameSet- 
ccrs:ldentifier- 
scrs : codes8806-/crs:codes 
e€crs:codeSpacesEPS6G-/crs : codeSpacex 
ecrs:editions5.2c/crs:editionx 
c/crs:1Identifierx 
xcrs:values0-/crs:values 
xs/ crs:Parameterx” 
ecrs:Parameterx 
ecrs:NameSet- 
ccrs:namesFalse Northing-/crs:namex 
c/ crs:NameSet- 
ecrs:ldentifier- 
scrs: codes8807-/crs:codes 
€crs: codeSpacexEPS6G-/ crs: codeSpacex 
ccrs:editions5.2c/crs:editionx 
c/crs:Identifiers 
ecrs:values0-/crs:valuex 
s/ crs:Parameterx” 
s/ crs:ParameterizedTransformationx 
xv/crs:CoordinateTransformationDefinitionx 
c/ crs:ProfectedCRS” 
sc/ crs:CoordinateReferenceSystem- 
c/rdf:Descriptionx 
c/ rdf:RDF” 
c/metadatax 
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c1-- the actual map content --x 
x/ svg” 
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7.15 DOM interfaces 


7.15.1 interface SVGPoint 


Many of the SVG DOM interfaces refer to obyiects of class SVGPoint. An SVGPoint is an (x, y) coordinate pair. 
VVhen used in matrix operations, an SVGPoint is treated as a vector of the form: 


İx1 
İyl 
(11 


If an SVGRect obiect is designated as read only, then attempting to assign to one of its attributes vvill result in an 


exception being throvvn. 
interface SVöPoint ( 


attribute float x setraises(DÜUMException) , 
attribute float y setraises(DÜMException), 


SV6Point matrixTransform(in SVGMatrix matrix), 


y 


Aftributes: 


e X (float) 


"The x coordinate. 
Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised if the SVGPoint obiect is read only, or corresponds to a DOM attribute that is read only. 


e y (float) 


"The y coordinate. 
Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised if the SVGPoint obiect is read only, or corresponds to a DOM attribute that is read only. 


Operations: 


e SVGPoint matrixTransform(in SVGMatrix matrix) 


Applies a 2x3 matrix transformation on this SVGPoint obyect and returns a nevv, transformed SVGPoint ob- 
fect: 
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nevpoint € matrix ” thispoint 
Parameters 


ə SVGMatrix matrix 
The matrix vvhich is to be applied to this SVGPoint obfect. 





Returns 
A nevv SVGPeint obiect. 


7.15.2 interface SV PointlList 


"This interface defines a list of SVGPoint obiects. 
SVGPointList has the same attributes and methods as other SVExxxlList interfaces. Implementers may con- 
sider using a single base class to implement the various SVGxxxList interfaces. 


interface SV6PointList ( 
readonly attribute unsigned 1ong numberüfTtems, 
void clear() raises(DüMException), 
SV6Point initialize(in SVGPoint nevltem) raises(DüMException) , 
SV6Point getItem(in unsigned long index) raises(DOMException) , 
SVGPoint insertItemBefore(in SVGPoint nevItem, in unsigned long index) raises(DOMException), 
SV6GPoint replaceltem(in SVGPoint nevltem, in unsigned long index) raises(DOMException) , 
SVGPoint removeTtem(in unsigned long index) raises (DOMException), 


SV6Point appendItem(in SVGöPoint nevltem) raises(DüMException) , 
R 


Attributes: 


e numberOfltems (readonly unsigned long) 


The number of items in the list. 
Operations: 


e void clear() 


Clears all existing current items from the list, vvith the result being an empty list. 
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Exceptions 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list cannot be modifted. 


SVGPoint initialize(in SVGPoint nevvltem) 


Clears all existing current items from the list and re-initializes the list to hold the single item specifted by 
the parameter. If the inserted item is already in a list, it is removed from its previous list before it is inserted 
into this list. The inserted item is the item itself and not a copy. 


Parameters 


e SVGPoint nevvltem 
"The item vvhich should become the only member of the list. 


Returns 
"The item being inserted into the list. 


Exceptions 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list cannot be modifted. 


SVGPoint getltem(in unsigned long index) 


Returns the specifted item from the list. The returned item is the item itself and not a copy. Any changes 
made to the item are immediately reflected in the list. 


Parameters 


e unsigned long index 
The index of the item from the list vvhich is to be returned. The first item is number 0. 


Returns 
"The selected item. 


Exceptions 


e DOMEvxception, code INDEX SIZE ERR 
Raised if the index number is greater than or equal to numberOfltems. 


e SVGPoint insertltemBefore(in SVGPoint nevvİfem, in unsigned long index) 


mserts a nevv item into the list at the specifted position. The first item is number 0. If nevvltem is already in 
a list, it is removed from its previous list before it is inserted into this list. The inserted item is the item itself 
and not a copy. If the item is already in this list, note that the index of the item to insert before is before the 
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removal of the item. 
Parameters 


e SVGPoint nevvltem 
The item vvhich is to be inserted into the list. 


e unsigned long index 
"The index of the item before vvhich the nevv item is to be inserted. The first item is number 0. If the 
index is equal to 0, then the nevv item is inserted at the front of the list. If the index is greater than or 


equal to numberOfltems, then the nevv item is appended to the end of the list. 





Returns 
"The inserted item. 


Exceptions 


e DOMException, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list cannot be modifted. 


e SVGPoint replaceltem(in SVGPoint nevvİtem, in unsigned long index) 


Replaces an existing item in the list vvith a nevv item. If nevvltem is already in a ist, it is removed from its 
previous list before it is inserted into this list. The inserted item is the item itself and not a copy. If the item 
is already in this list, note that the index of the item to replace is before the removal of the item. 


Parameters 


e SVGPoint nevvltem 
The item vvhich is to be inserted into the list. 


e unsigned long index 
The index of the item vvhich is to be replaced. The first item is number 0. 


Returns 
"The inserted item. 
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Exceptions 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list cannot be modifted. 


e DOMEvxception, code INDEX SIZE ERR 


Raised if the index number is greater than or equal to numberOfltems. 


e SVGPoint removeltemtin unsigned long index) 


Removes an existing item from the list. 
Parameters 


e unsigned long index 
The index of the item vvhich is to be removed. The first item is number 0. 


Returns 
The removed item. 


Exceptions 


e DOMException, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list cannot be modifted. 


e DOMEvxception, code INDEX SIZE ERR 


Raised if the index number is greater than or equal to numberOfltems. 


e SVGPoint appendlİtem(in SVGPoint nevltem) 


mserts a nevv item at the end of the list. If nevvİtem is already in a İist, it is removed from its previous list 
before it is inserted into this list. The inserted item is the item itself and not a copy. 


Parameters 


e SVGPoint nevvltem 
The item vvhich is to be inserted. The first item is number 0. 


Returns 
"The inserted item. 


Exceptions 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list cannot be modifted. 
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7.15.3 Interface SVGMatrix 


Many of SVGss graphics operations utilize 2x3 matrices of the form: 


fa c el 
İb d f1 


vvhich, vvhen expanded into a 3x3 matrix for the purposes of matrix arithmetic, become: 





fa c el 
İb d f1 
(0 0 11 


interface SV6Matrix ( 

attribute float a setraises(DÜMException), 
attribute float b setraises(DÜMException) , 
attribute float c setraises(DÜMException) , 
attribute float d setraises(DÜMException), 
attribute float e setraises(DÜMException) , 
attribute float f setraises(DOMException), 


SVGMatrix multiply(in SVGMatrix secondMatrix), 
SVGMatrix inverse() raises(SVGException), 
SVöMatrix translate(in float x, in float y), 
SVGMatrix scale(in float scaleFactor), 
SVGMatrix scaleNonUniform(in float scaleFactorX, in float scaleFactorY), 
SVGMatrix rotate(in float angle), 
SVGMatrix rotateFromVector(in float x, in float y) raises(SVGException), 
SVöMatrix flipX(), 
SVGMatrix flipY(), 
SV6Matrix skevX(in float angle), 
SVGMatrix skevY(in float angle), 
Hn 


Aftributes: 


e a (float) 


"The a component of the matrix. 
Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 
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e b (float) 


"The b component of the matrix. 
Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e c (float) 
"The c component of the matrix. 
Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e d (float) 
"The d component of the matrix. 
Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e € (float) 
"The € component of the matrix. 
Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e f (float) 


The f component of the matrix. 


Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 
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Operations: 


e SVGMatrix multipiy(in SVGMatrix secondMatrix) 


Performs matrix multiplication. This matrix is post-multiplied by another matrix, returning the resulting 


nevv matrix. 


Parameters 





ə SVGMatrix secondMatrix 
The matrix v/hich is post-multiplied to this matrix. 


Returns 
The resulting matrix. 


e SVGMatrix inverse() 


Returns the inverse matrix. 


Returns 
"The inverse matrix. 


Exceptions 


e SVGException, code SVG MATRIX NOT INVERTABLE 
Raised if this matrix is not invertable. 


e SVGMatrix translatetin float x, in float y) 


Post-multiplies a translation transformation on the current matrix and returns the resulting matrix. 
Parameters 


ə float x 
The distance to translate along the x-axis. 


e float y 
The distance to translate along the y-axis. 


Returns 
The resulting matrix. 


e SVGMatrix scale(in float scaleFactor) 
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Post-multiplies a uniform scale transformation on the current matrix and returns the resulting matrix. 
Parameters 


e float scaleFactor 
Scale factor in both X and Y. 


Returns 
The resulting matrix. 





e SVGMatrix scaleNonUniformtin float scaleFactorX, in float scaleFactorY) 


Post-multiplies a non-uniform scale transformation on the current matrix and returns the resulting matrix. 
Parameters 


e float scaleFactorX 
Scale factor in X. 


e float scaleFactorY 
Scale factor in Y. 


Returns 
The resulting matrix. 


e SVGMatrix rotate(in float ang1e) 


Post-mulltiplies a rotation transformation on the current matrix and returns the resulting matrix. 


Parameters 


e float angle 
Rotation angle. 


Returns 
The resulting matrix. 


e SVGMatrix rotateFromVector(in float x, in float y) 


Post-multiplies a rotation transformation on the current matrix and returns the resulting matrix. The rotation 
angle is determined by taking (“/-) atan(y/x). The direction of the vector (x, y) determines vvhether the pos- 
itive or negative angle value is used. 
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Parameters 


e float x 
"The X coordinate of the vector (x,y). Must not be zero. 


e float y 
"The Y coordinate of the vector (x,y). Must not be zero. 





Returns 
The resulting matrix. 


Exceptions 


e SVGException, code SVG INVALID VALUE ERR 
Raised if one of the parameters has an invalid value. 


e SVGMatrix flipX() 
Post-multiplies the transformation T-1 0 0 1 0 0) and returns the resulting matrix. 


Returns 
The resulting matrix. 


e SVGMatrix flipY() 
Post-multiplies the transformation 11 0 0 -1 0 0İ and returns the resulting matrix. 


Returns 
The resulting matrix. 


e SVGMatrix skevvX(in float angle) 
Post-multiplies a skevvX transformation on the current matrix and returns the resulting matrix. 
Parameters 


e float angle 
Skevr angle. 


Returns 
The resulting matrix. 


e SVGMatrix skevvYiin float angle) 
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Post-multiplies a skevvY transformation on the current matrix and returns the resulting matrix. 
Parameters 


e float angle 
Skevr angle. 


Returns 
The resulting matrix. 





7.15.4 Interface SVGTransform 


SVGTTransform is the interface for one of the component transformations vvithin an SVGTransformlist, thus, an 
SVGTTransform obiect corresponds to a single component (e.g., "scale(...)” or "matrix(...)”) vvithin a “transform” attrib- 
ute specification. 


interface SV6Transform £f 


// Transform Types 
const unsigned short SVG TRANSFORM UNKNOUN - 0, 
const unsigned short SVG TRANSFOURM MATRIX £ 1, 
const unsigned short SVG TRANSFORM TRANSLATE - 
const unsigned short SVG TRANSFOURM SCALE z 3, 

const unsigned short SVG TRANSFOURM ROTATE £ 4, 
const unsigned short SVG TRANSFORM SKEVX 
const unsigned short SVG TRANSFORM SKEVY 


z 


mz 5: 
z 6, 
readonly attribute unsigned short type, 


readonly attribute SVGMatrix matrix, 
readonly attribute float angle, 


void setMatrix(in SVGMatrix matrix) raises(DÜMException), 
void setTranslate(in float tx, in float ty) raises(D0MException), 
void setScale(in float sx, in float sy) raises(DOüMException), 
void setRotate(in float angle, in float cx, in float cy) raises(DOMException) , 
void setSkevX(in float angle) raises(DÜMException) , 
void setSkevY(in float angle) raises(DÜMException) , 
y 


Constants in group “Transform Types”: 


e SVG TRANSFORM UNKNOVVN (unsigned short) 


"The unit type is not one of predefined types. İt is invalid to attempt to define a nevv value of this type or to 
attempt to svvitch an existing value to this type. 


e SVG TRANSFORM MATRIX (ınsigned short) 


A "matrixt...) transformation. 


e SVG TRANSFORM TRANSLATE (unsigned short) 
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A "translate(.../ transformation. 


e SVG TRANSFORM SCALF (unsigned short) 


A "scale(...)" transformation. 


e SVG TRANSFORM ROTATE (nsigned short) 





A "rotate(...)" transformation. 


e SVG TRANSFORM SKEVVX (unsigned short) 


A "skevvX(...y transformation. 


e SVG TRANSFORM SKEVVY (unsigned short) 


A "skevvY(.../ transformation. 
Attributes: 


e İype (readonly unsigned short) 
The type of the value as specifted by one of the SVG TRANSFORM “ constants defined on this interface. 


e matrix (readonly SVGMatrix) 


"The matrix that represents this transformation. The matrix obfect is live, meaning that any changes made to 
the SVGTransform obiect are immediately reflected in the matrix obfect and vice versa. In case the matrix 
obyect is changed directly (i.e., vvithout using the methods on the SVGTransform interface itself) then the 
type of the SVGTransform changes to SVG TRANSFORM MATRIX. 


e For SVG TRANSFORM MATRIX, the matrix contains the a, b, c, d, e, f values supplied by the user. 

e For SVG TRANSFORM TRANSLATE, e and f represent the translation amounts (a-1, b-0, c-0 and 
d-1). 

e For SVG TRANSFORM SCALE, a and d represent the scale amounts (be0, c-0, e-0 and f-0). 

e For SVG TRANSFORM SKEVVX and SVG TRANSFORM SKEVYY, a, b, c and d represent the matrix 
vvhich vvill result in the given skevv (e-0 and f-0). 
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e For SVG TRANSFORM ROTATB, a, b, c, d, e and f together represent the matrix vvhich vvill result in 
the given rotation. VVhen the rotation is around the center point (0, 0), e and f vvill be zero. 


e angle (readonly float) 


A convenience attribute for SVG TRANSFORM ROTATE, SVG TRANSFORM SKEVX and 
SVG TRANSFORM SKEVVY. Tt holds the angle that vvas specifted. 
For SVG TRANSFORM MATRIX, SVG TRANSFORM TRANSLATE and SVG TRANSFORM SCALE, 


angle vvill be zero. 
Operations: 


e void setMatrix(in SVGMatrix matrix) 


Sets the transform type to SVG "TRANSFORM, MATRIX, vvith parameter mafrix defining the nevv trans- 
formation. The values from the parameter mafrix are copied, the mafrix parameter does not replace 
SVGTransform:-matrix. 


Parameters 


e SVGMatrix matrix 
The nevv matrix for the transformation. 


Exceptions 


e DOMException, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e void setTranslate(in float fx, in float £y) 


Sets the transform type to SVG TRANSFORM TRANSLATE, vvith parameters fx and £fy defining the trans- 
lation amounts. 


Parameters 


e float fx 
The translation amount in X. 


e float £y 
The translation amount in Y. 


Exceptions 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 
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e void setScaletin float sx, in float sy) 


Sets the transform type to SVG TRANSFORM SCALE, vvith parameters sx and sy defining the scale 
amounts. 


Parameters 


e float sx 





The scale amount in X. 


e float sy 
The scale amount in Y. 


Exceptions 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e void setRotate(in float angle, in float ex, in float cy) 


Sets the transform type to SVG TRANSFORM ROTATE, vvith parameter ang/e defining the rotation angle 
and parameters ex and cy defining the optional center of rotation. 


Parameters 


e float angle 
The rotation angle. 


e float ex 
The x coordinate of center of rotation. 


e float cy 
"The y coordinate of center of rotation. 


Exceptions 


e DOMException, code NO MODIHFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e void setSkevvXfin float angfe) 
Sets the transform type to SVG TRANSFORM SKEVVX, vvith parameter angle defining the amount of skevv. 


Parameters 
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e float angle 
The skevv angle. 


Exceptions 


e DOMException, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 





e void setSkevvY(in float ang1e) 
Sets the transform type to SVG "TRANSFORM, SKEVVY, vvith parameter angle defining the amount of skevv. 


Parameters 


e float angle 
The skevv angle. 


Exceptions 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


7.15.5 interface SVGTransformList 


This interface defines a list of SVGTransform obiects. 

The SVGTransformList and SVGTransform interfaces correspond to the various attributes vvhich specify a set 
of transformations, such as the “transform” attribute vvhich is available for many of SVG"s elements. 

SVGTransformList has the same attributes and methods as other SVGxxxlList interfaces. ITmplementers may 
consider using a single base class to implement the various SVOxxxlList interfaces. 

An SVGTransformList obiect can be designated as read only, vvhich means that attempts to modify the obfect 
vvill result in an exception being throvvn, as described belovv. 


interface SV6TransformList ( 
readonly attribute unsigned 1ong numberüfTtems, 


void clear() raises(DÜüMException), 

SVGTransform initialize(in SVGTransform nevltem) raises(DüMException), 

SVGTransform getIltem(in unsigned long index) raises(D0MException), 

SVGTransform insertItemBefore(in SVGTransform nevItem, in unsigned long index) raises(DOMException) , 


SVGTransform replaceltem(in SVGTransform nevlItem, in unsigned long index) raises (DÜMException), 
SVGTransform removeT1tem(in unsigned long index) raises(DOMException), 
SVGTransform appendTtem(in SVGTransform nev/Ttem) raises(DOMException) , 
SVGTransform createSVGTransformFromMatrix(in SVGMatrix matrix), 
SVGTransform consolidate() raises (DüMException) , 
y 
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Attributes: 


e numberOfltems (readonly unsigned long) 


The number of items in the list. 


Operations: 





e void clear() 


Clears all existing current items from the list, vvith the result being an empty list. 


Exceptions 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list corresponds to a read only attribute or vvhen the obiect itself is read only. 


e SVGTransform initializefin SVGTransform nevvltem) 


Clears all existing current items from the list and re-initializes the list to hold the single item specifted by 
the parameter. If the inserted item is already in a list, it is removed from its previous list before it is inserted 
into this list. The inserted item is the item itself and not a copy. 


Parameters 


e SVGTransform nevvİtem 
"The item vvhich should become the only member of the list. 


Returns 
"The item being inserted into the list. 


Exceptions 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list corresponds to a read only attribute or vvhen the obiect itself is read only. 
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e SVGTransform getltemi(in unsigned long index) 


Returns the specifted item from the list. The returned item is the item itself and not a copy. Any changes 
made to the item are immediately reflected in the list. 


Parameters 


e unsigned long index 
The index of the item from the list vvhich is to be returned. The first item is number 0. 


Returns 
"The selected item. 


Exceptions 


e DOMException, code INDEX SIZE ERR 
Raised if the index number is greater than or equal to numberOfltems. 


SVGTransform insertItemBefore(in SVGTransform nevvifem, in unsigned long index) 


Imserts a nevv item into the list at the specifted position. The first item is number 0. If nevvlfem is already in 
a list, it is removed from its previous list before it is inserted into this list. The inserted item is the item itself 
and not a copy. If the item is already in this list, note that the index of the item to insert before is before the 


removal of the item. 
Parameters 


e SVGTransform nevvltem 
The item vvhich is to be inserted into the list. 


e unsigned long index 
The index of the item before vvhich the nevv item is to be inserted. "The first item is number 0. If the 
index is equal to 0, then the nevv item is inserted at the front of the list. If the index is greater than or 
equal to numberOfltems, then the nevv item is appended to the end of the list. 


Returns 
"The inserted item. 


Exceptions 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list corresponds to a read only attribute or vvhen the obiect itself is read only. 


e SVGTransform replaceltem(in SVGTransform nevvlfem, in unsigned long index) 


Replaces an existing item in the list vvith a nevv item. If nevvİtem is already in a list, it is removed from its 
previous list before it is inserted into this list. The inserted item is the item itself and not a copy. If the item 
is already in this list, note that the index of the item to replace is before the removal of the item. 
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Parameters 


e SVGTransform nevvltem 
The item vvhich is to be inserted into the list. 


e unsigned long index 
"The index of the item vvhich is to be replaced. The first item is number 0. 





Returns 
"The inserted item. 


Exceptions 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list corresponds to a read only attribute or vvhen the obiect itself is read only. 


e DOMEvxception, code INDEX SIZE ERR 


Raised if the index number is greater than or equal to numberOfltems. 


e SVGTransform removeltemtin unsigned long index) 


Removes an existing item from the list. 
Parameters 


e unsigned long index 
The index of the item vvhich is to be removed. The first item is number 0. 


Returns 
The removed item. 


Exceptions 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list corresponds to a read only attribute or vvhen the obiect itself is read only. 


e DOMException, code INDEX SIZE ERR 
Raised if the index number is greater than or equal to numberOfltems. 
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e SVGTransform appenditem(in SVGTransform nevvitem) 


mserts a nevv item at the end of the list. If nevvİtem is already in a İist, it is removed from its previous list 
before it is inserted into this list. The inserted item is the item itself and not a copy. 


Parameters 


e SVGTransform nevvltem 
The item vvhich is to be inserted. The first item is number 0. 


Returns 
"The inserted item. 


Exceptions 


e DOMException, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list corresponds to a read only attribute or vvhen the obiect itself is read only. 


e SVGTransform createSVGTransformFromMatrix(in SVGMatrix mafrix) 
Creates an SVGTransform obiect vvhich is initialized to transform of type SVG "TRANSFORM MATRIX and 
vvhose values are the given matrix. The values from the parameter mafrix are copied, the mafrix parameter 
is not adopted as SVGTransform::matrix. 


Parameters 


e SVGMatrix matrix 
The matrix vvhich defines the transformation. 


Returns 
"The returned SVGTransform obiect. 


SVGTransform consolidate() 


Consolidates the list of separate SVGTransform obiects by multiplying the equivalent transformation 
matrices together to result in a list consisting of a single SVGTransform obfiect of type 
SVG TRANSFORM MATRIX. The consolidation operation creates nevv SVGTransform obiect as the first 
and only item in the list. The returned item is the item itself and not a copy. Any changes made to the item 
are immediately reflected in the list. 


Returns 
"The resulting SVGTransform obiect vvhich becomes single item in the list. If the list vvas empty, then a 
value of null is returned. 
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Exceptions 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list corresponds to a read only attribute or vvhen the obiect itself is read only. 


7.15.6 Interface SVGAnimatedTransformList 


Used for the various attributes vvhich specify a set of transformations, such as the “transform” attribute vvhich is 
available for many of SVG“s elements, and vvhich can be animated. 


interface SVGAnimatedTransformList ( 
readonly attribute SVGTransformList baseVal, 
readonly attribute SVGTransformList animVal, 


Aftributes: 


e baseVal (readonly SVGTransformList) 


The base value of the given attribute before applying any animations. 


e animVal (readonly SVGTransformList) 


A read only SVGTransformlist representing the current animated value of the given attribute. If the given 
attribute is not currently being animated, then the SVGTransformList vvill have the same contents as baseVal. 
"The obfect referenced by animVal vvill alvrays be distinct from the one referenced by baseVal, even vvhen the 
attribute is not animated. 


7.15.7 Interface SVGPreserveAspectRatio 


The SVGPreserveAspectRatio interface corresponds to the “preserveAspectRatio” attribute, vvhich is available for 
some of SVG"s elements. 

An SVGPreserveAspectRatio obfect can be designated as read only, vvhicdh means that attempts to modify the ob- 
fect vvill result in an exception being throvvn, as described belovv. 


interface SV6PreserveAspectRatio 1 


// Alignment Types 
const unsigned short SVG PRESERVEASPECTRATI0 UNKNOUMN z 0, 
const unsigned short SVG PRESERVEASPECTRATI0 NONE c 1, 
const unsigned short SVG PRESERVEASPECTRATI0 XMINYMIN 
const unsigned short SVG PRESERVEASPECTRATI0 XMIDYMIN 
const unsigned short SVG PRESERVEASPECTRATI0 XMAXYMIN 
const unsigned short SVG PRESERVEASPECTRATI0 XMINYMID 
const unsigned short SVG PRESERVEASPECTRATI0 XMIDYMID 
const unsigned short SVG PRESERVEASPECTRATI0 XMAXYMID 
const unsigned short SVG PRESERVEASPECTRATI0 XMINYMAX 
const unsigned short SVG PRESERVEASPECTRATI0 XMIDYMAX 
const unsigned short SVG PRESERVEASPECTRATI0 XMAXYMAX 


ıı yu us 
Pe O Oo — OUT 5) 
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// Meet-or-slice Types 


const unsigned short SVG MEETORSLICE UNKNOUN - 0, 
const unsigned short SVG MEETORSLICE MEET 1, 
const unsigned short SVG MEETORSLTCE SLTCE £ 2, 


attribute unsigned short align setraises(DOMException) , 
attribute unsigned short meetürSlice setraises (DÜMException), 
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Constants in group “Alignment Types”: 


“ SVG PRESERVEASPECTRATIO UNKNOVVN (unsigned short) 


The enumeration vvas set to a value that is not one of predefined types. İt is invalid to attempt to define a 
nevv value of this type or to attempt to svvitch an existing value to this type. 





“ SVG PRESERVEASPECTRATIO NONE (unsigned short) 


Corresponds to value "one" for attribute “preserveAspectRatio”. 


e SVG PRESERVEASPECTRATIO XMINYMIN (unsigned short) 


Corresponds to value "xMinYMin" for attribute “preserveAspectRatio”. 


" SVG PRESERVEASPECTRATIO XMIDYMIN (unsigned short) 


Corresponds to value "xMidYMin" for attribute “preserveAspectRatio”. 


e SVG PRESERVEASPECTRATIO XMAXVMIN (unsigned short) 


Corresponds to value "xMaxYMin" for attribute “preserveAspectRatio”. 


" SVG PRESERVEASPECTRATIO XMINYMID (unsigned short) 


Corresponds to value "XMinYMid" for attribute “preserveAspectRatio”. 


SVG. PRESERVEASPECTRATIO XMIDYMID (unsigned short) 


Corresponds to value "xMidYMid" for attribute “preserveAspectRatio”. 


SVG PRESERVEASPECTRATIO XMAXYMID (unsigned short) 


Corresponds to value "xMaxYMidr" for attribute “preserveAspectRatio”. 


e SVG PRESERVEASPECTRATIO XMINYMAX (unsigned short) 


Corresponds to value "xMinYMax" for attribute “preserveAspectRatio”. 


“" SVG PRESERVEASPECTRATIO XMIDYMAX (unsigned short) 
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Corresponds to value "xMidYMaxr for attribute “preserveAspectRatio”. 


e SVG PRESERVEASPECTRATIO XMAXYMAX (unsigned short) 


Corresponds to value "xMaxYMaxr for attribute “preserveAspectRatio”. 


Constants in group “Meet-or-slice Types”: 





e SVG MEETORSLICE UNKNOVVN (unsigned short) 


The enumeration vvas set to a value that is not one of predefined types. İt is invalid to attempt to define a 
nevv value of this type or to attempt to svvitch an existing value to this type. 


e SVG MEETORSLICE MEET (unsigned short) 


Corresponds to value "meet" for attribute “preserveAspectRatio”. 


e SVG MEETORSLICE SLİCE (unsigned short) 


Corresponds to value "slice" for attribute “preserveAspectRatio”. 
Attributes: 


e align (unsigned short) 


The type of the alignment value as specified by one of the SVG PRESERVEASPECTRATIO “ constants 
defined on this interface. 


Exceptions on setting 


ə DOMException, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the obyect corresponds to a read only attribute or vrhen the obiect itself is read only. 


e meetOrsSlice (unsigned short) 


The type of the meet-or-slice value as specified by one of the SVG MEETORSLICE “ constants defined on 


this interface. 


Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the obiect corresponds to a read only attribute or vvhen the obiect itself is read only. 
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7.15.8 Interface SVGAnimatedPreserveAspectRatio 


Used for attributes of type SVGPreserveAspectRatio vvhich can be animated. 


interface SVGAnimatedPreserveAspectRatio ( 

readonly attribute SVGPreserveAspectRatio baseVal, 
readonly attribute SVGPreserveAspectRatio animVal, 
ii 





Attributes: 


e baseVal (readonly SVGPreserveAspectRatio) 


The base value of the given attribute before applying any animations. 


e animVal (readonly SVGPreserveAspectRatio) 


A read only SVGPreserveAspectRatio representing the current animated value of the given attribute. If 
the given attribute is not currently being animated, then the SVGPreserveAspectRatio vvill have the same 
contents as baseVal. The obiect referenced by animVal vvill alvvays be distinct from the one referenced by 
baseVal, even vvhen the attribute is not animated. 


S Paths 


Contents 
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8.1 Introduction 
8.2 The “path” element 
8.3 Path data 
8.3.1 General information about path data 
8.3.2 The "moveto" commands 
8.3.3 The "closepath" command 
8.3.4 The "lineto" commands 
8.3.5 The curve commands 





8.3.6 The cubic Bezier curve commands 
8.3.7 The quadratic Bezier curve commands 
8.3.8 The elliptical arc curve commands 
8.3.9 The grammar for path data 
8.4 Distance along a path 
8.5 DOM interfaces 
8.5.1 Interface SVGPathSeg 
8.5.2 mterface SVGPathSegClosePath 
8.5.3 İnterface SVGPathSegMovetoAbs 
8.5.4 İnterface SVGPathSegMovetoRel 
8.5.5 Interface SVGPathSegLinetoAbs 
8.5.6 Interface SVGPathSegLinetoRel 
8.5.7 Interface SVGPathSegCurvetoCubicAbs 
8.5.8 Interface SVGPathSegCurvetoCubicRel 
8.5.9 Interface SVGPathSegCurvetoQuadraticAbs 
8.5.10 Interface SVGPathSegCurvetoQuadraticRel 
8.5.11 Interface SVGPathSegArcAbs 
8.5.12 Interface SVGPathSegAreRel 
8.5.13 Interface SVGPathSegLinetoHorizontalAbs 
8.5.14 Interface SVGPathSegLinetoHorizontalRel 
8.5.15 Interface SVGPathSeglLinetoVerticalAbs 
8.5.16 Interface SVGPathSegLinetoVerticalRel 
8.5.17 Interface SVGPathSegCurvetoCubieSmoothAbs 
8.5.18 Interface SVGPathSegCurvetoCubicSmoothRel 
8.5.19 Interface SVGPathSegCurvetoQuadraticSmoothAbs 
8.5.20 Interface SVGPathSegCurvetoQuadraticSmoothRel 
8.5.21 Interface SVGPathSeglist 
8.5.22 Interface SVGAnimatedPathData 
8.5.23 Interface SVGPathElement 
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8.1 İntroduction 


Paths represent the outline of a shape vvhich can be filled, stroked, used as a clipping path, or any combination of 
the three. (See Filling, Stroking and Paint Servers and Clipping, Masking and Compositing.) 

A path is described using the concept of a current point. In an analogy vvith dravving on paper, the current 
point can be thought of as the location of the pen. The position of the pen can be changed, and the outline of a 
shape (open or closed) can be traced by dragging the pen in either straight lines or curves. 

Paths represent the geometry of the outline of an obfect, defined in terms of movefo (set a nevv current point), 
lineto (dravv a straight line), curveto (dravv a curve using a cubic Bezier), arc (elliptical or circular arc) and closepatfh 
(close the current shape by dravving a line to the last movefo) elements. Compound paths (i.e., a path vvith multiple 
subpaths) are possible to allovv effects such as "donut holes" in obiects. 

"This chapter describes the syntax, behavior and DOM interfaces for SVG paths. Various implementation notes 
for SVG paths can be found in Path” element implementation notes and Elliptical arc implementation notes. 

A path is defined in SVG using the “path” element. 


8.2 The “path” element 


Categories: “path” 
Graphics element, shape element 


Content model: 
Any number of the follovving elements, in any order: 
animation elements 
descriptive elements 


Attributes: 
conditional processing attributes 
core attributes 
graphical event attributes 
presentation attributes 
“class” 
“style” 
“externalResourcesRequired” 
“transform” 
“” 
“pathLength” 

DOM Interfaces: 
SVGPathElement 


Attribute definitions: 


d - "path data" 
"The definition of the outline of a shape. See Path data. 
Animatable: yes. Path data animation is only possible vvhen each path data specification vvithin an animation 
specification has exactly the same list of path data commands as the “d” attribute. If an animation is specifted 
and the list of path data commands is not the same, then the animation specification is in error (see Error 
Processing). The animation engine interpolates each parameter to each path data command separately based 
on the attributes to the given animation element. Flags and booleans are interpolated as fractions betvveen 
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zero and one, vvith any non-zero value considered to be a value of one/true. 


pathLength - "-number”" 
"The author"s computation of the total length of the path, in user units. This value is used to calibrate the user 
agent/s ovvn distance-along-a-path caleulations vvith that of the author. The user agent vvill scale all distance- 
along-a-path computations by the ratio of “pathLengih” to the user agent"s ovvn computed value for total path 





length. “pathLengih” potentially affects calculations for text on a path, motion animation and various stroke 
operations. 

A negative value is an error (see Error processing). 

Animatable: yes. 


8.3 Path data 


8.3.1 General information about path data 


A path is defined by including a “path” element vvhich contains a d-"(path data)" attribute, vvhere the “d” attribute 
contains the movefo, line, curve (both cubic and quadratic Beziers), arc and closepath instructions. 

Example triangle01 speciftes a path in the shape of a triangle. (The M indicates a movetfo, the Ls indicate 
linetos, and the z indicates a cİosepath). 


c?xml versionz"1.0" standalone-"no"?z 
x 1DOCTYPE svg PUBLİC "-//V3C/ //DTD SVG 1.1//EN" 
"http: / /vvv/.vV3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
c€svg vidth-"4cm" height-"4cm" vievBoxz"0 0 400 400" 
xmlnsz"http: / /vuv/ .vV3.0T9/2000/svg" versionze"1.1"5 
etitlesExample triangle01- simple example of a "path"-/titles 
edescsA path that dravs a triangle-c/desc- 
crect xe"1" y-"1" vidth-"398" height-"398" 
fill-"none" strokez"blue" /s 
scpath d-"M 100 100 L 300 100 L 200 300 z" 
fill-"red" strokez"blue" stroke-vidth-"3" /5 
s/ svg” 
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Example triangle01 


Path data can contain nevvline characters and thus can be broken up into multiple lines to improve readability. 
Because of line length limitations vvith certain related tools, it is recommended that SVG generators split long path 
data strings across multiple lines, vvith each line not exceeding 255 characters. Also note that nevvline characters 
are only allovved at certain places vvithin path data. 

The syntax of path data is concise in order to allovv for minimal file size and efficient dovvnloads, since many 
SVG files vvill be dominated by their path data. Some of the vvays that SVG attempts to minimize the size of path 
data are as follovvs: 


e Aİ instructions are expressed as one character (e.g., a movefo is expressed as an M). 

e Superfluous vvhite space and separators such as commas can be eliminated (e.g., "M 100 100 L 200 200" con- 
tains unnecessary spaces and could be expressed more compactly as "M100 1001200 200"). 

e "Ihe command letter can be eliminated on subsequent commands if the same command is used multiple times 
in a rovv (e.g., you can drop the second "L" in "M 100 200 L 200 100 L -100 -200" and use "M 100 200 L 200 100 
-100 -200" instead). 

e Relative versions of all commands are available (uppercase means absolute coordinates, lovvercase means re- 
lative coordinates). 

e Alternate forms of /inefo are available to optimize the special cases of horizontal and vertical lines (absolute 
and relative). 

e Alternate forms of curve are available to optimize the special cases vrhere some of the control points on the 
current segment can be determined automatically from the control points on the previous segment. 


The path data syntax is a prefix notation (i.e., commands follovved by parameters). The only allovvable decimal 
point is a Unicode U40046 FULL STOP ("") character (also referred to in Unicode as PERIOD, dot and decimal 
point) and no other delimiter characters are allovved TUNICODEİ. (For example, the follovving is an invalid nu- 
meric value in a path data stream: "13,000.56". Instead, say: "13000.56".) 

For the relative versions of the commands, all coordinate values are relative to the current point at the start 
of the command. 

m the tables belovv, the follovving notation is used: 


e (): grouping of parameters 
e  10Tr more of the given parameter(s) is required 
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The follovving sections list the commands. 


8.3.2 The "moveto" commands 
The "moveto" commands (M or m) establish a nevv current point. The effect is as if the "pen" vvere İifted and 


moved to a nevv location. A path data segment (if there is one) must begin vvith a "moveto" command. Subsequent 
"moveto" commands (:.e., vvhen the "moveto" is not the first commandl) represent the start of a nevv subpafh: 


Start a nevv sub-path at the given (x,y) coordinate. M (uppercase) 
indicates that absolute coordinates vvill follovv, m (lovvercase) indicates 
that relative coordinates vvill follovv. If a moveto is follovved by multiple 
M pairs of coordinates, the subsequent pairs are treated as implicit lineto 
(absolute) commands. Hence, implicit lineto commands viill be relative if the 
moveto İ (x y)- 5 : 2 : : 
m moveto is relative, and absolute if the moveto is absolute. If a relative 
(relative) moveto (m) appears as the first element of the path, then it is treated 
as a pair of absolute coordinates. In this case, subsequent pairs of 
coordinates are treated as relative even though the initial moveto is 
interpreted as an absolute moveto. 


8.3.3 The "closepath" command 



















"The "closepath" (Z or z) ends the current subpath and causes an automatic straight line to be dravvn from the cur- 
rent point to the initial point of the current subpath. If a "closepath" is follovved immediately by a "moveto", then 
the "moveto" identifies the start point of the next subpath. If a "closepath" is follovved immediately by any other 
command, then the next subpath starts at the same initial point as the current subpath. 

VVhen a subpath ends in a "cİosepath, it differs in behavior from vvhat happens vvhen "manually" closing a 
subpath via a "lineto" command in hovv “stroke-line/oin” and “stroke-linecap” are implemented. VVith "closepath", 
the end of the final segment of the subpath is "ioined" vvith the start of the initial segment of the subpath using 
the current value of “stroke-lineyoin”. If you instead "manually" close the subpath via a "lineto" command, the start 
of the first segment and the end of the last segment are not foined but instead are each capped using the current 
value of “stroke-linecap”. At the end of the command, the nevv current point is set to the initial point of the current 


subpath. 


Close the current subpath by dravving a straight line from the current 
closepath İ (none) point to current subpath"s initial point. Since the Z and z commands 
take no parameters, they have an identical effect. 











8.3.4 The "lineto" commands 


"The various "lineto" commands dravv straight lines from the current point to a nevv point: 


İ command İ Name Parameters ı Description 


Dravv a line from the current point to the given (x,y) coordinate vvhich 
becomes the nevv current point. L (uppercase) indicates that 
: absolute coordinates vvill follovv: 1 (lovvercase) indicates that relative 
lineto (x y)ı ı ) : : 
coordinates vvill follovv. A number of coordinates pairs may be 
specified to dravv a polyline. At the end of the command, the nevv 
current point is set to the final set of coordinates provided. 
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L 
(absolute) 
I (relative) 















Dravvs a horizontal line from the current point (cpx, cpy) to (x, cpy). H 
(uppercase) indicates that absolute coordinates vvill follovv, h 


H 
(absolute) 
h (relative) 


(lovvercase) indicates that relative coordinates vvill follovv. Multiple x 
values can be provided (although usually this doesn" make sense). 
At the end of the command, the nevv current point becomes (x, cpy) 


horizontal 
lineto 


for the final value of x. 


" 
Dravvs a vertical line from the current point (cpx, cpy) to (cpx, y). V 
(uppercase) indicates that absolute coordinates vvill follovv, v 

. (lovvercase) indicates that relative coordinates vvill follovv. Multiple y 
values can be provided (although usually this doesn" make sense). 
At the end of the command, the nevv current point becomes (cpx, y) 
for the final value of y. 






V 
(absolute) 
v (relative) 





vertical 
lineto 




















8.3.5 The curve commands 
"These three groups of commands dravv curves: 
e Cubic Bezier commands (C, c, S and s). A cubic Bezier segment is defined by a start point, an end point, and 
tvvo control points. 
e Quadratic Bözier commands (Q, q, T and t). A quadratic Bezier segment is defined by a start point, an end 


point, and one control point. 
e Elliptical arc commands (A and a). An elliptical arc segment dravvs a segment of an ellipse. 


8.3.6 The cubic Bözier curve commands 


"The cubic Bezier commands are as follovvs: 


Dravvs a cubic Bözier curve from the current point to (x,y) using 
(x1,y1) as the control point at the beginning of the curve and (x2,y2) 
as the control point at the end of the curve. C (uppercase) indicates 
(x1y1x2 y2 İ that absolute coordinates vvill follovv, c (lovvercase) indicates that 

X y)- relative coordinates vvill follovv. Multiple sets of coordinates may be 
specified to dravv a polybözier. At the end of the command, the nevv 
current point becomes the final (x,y) coordinate pair used in the 
polybezier. 
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Cc 
(absolute) 1 curveto 
c (relative) 





Dravvs a cubic Bözier curve from the current point to (x,y). The first 
control point is assumed to be the reflection of the second control 
point on the previous command relative to the current point. (If there 
is no previous command or if the previous command vas not an C, 
s shorthand/ c, S or s, assume the first control point is coincident vvith the current 
(absolute) 1 smooth (x2 y2 xy)- Iİ point.) (x2,y2) is the second control point (i.e., the control point at 

s (relative) İ curveto the end of the curve). S (uppercase) indicates that absolute 
coordinates vvill follovv, s (lovvercase) indicates that relative 
coordinates vvill follovv. Multiple sets of coordinates may be specified 
to dravv a polybezier. At the end of the command, the nevv current 
point becomes the final (x,y) coordinate pair used in the polybezier. 




















Example cubic01 shovvs some simple uses of cubic Bözier commands vvithin a path. The example uses an internal 
CSS style sheet to assign styling properties. Note that the control point for the "S" command is computed auto- 
matically as the reflection of the control point for the previous "C" command relative to the start point of the "S" 
command. 


c?xml versionz"1.0" standalone-"no"?z 
x 1DOCTYPE svg PUBLİC "-//V/3C/ /DTD SVG 1.1//EN" 
"http: / /vvv/..v/3..org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
€Ssvg vidthe"5cm" heighte"4cm" vieuvBoxz"0 0 500 400" 
xmlnse"http://vuv/.v3.0rg/2000/svg" versionz"1.1"5 
etitlesExample cubic01- cubic Bözier commands in path datac/titlex 
edescsPicture shoving a simple example of path data 
using both a "C" and an "S" command, 
along vith annotations shoving the control points 
and end points-/desc” 
estyle typez"text/css"x-ci TCDATAL 
.Border 1 fill:none, stroke:blue, stroke-vidth:1 ) 
.Connect ( fill:none, stroke:£888888, stroke-vidth:2 ) 
.SamplePath ( fill:none, stroke:red, stroke-vidth:5 1) 
.EndPoint ( fill:none, stroke:4888888, stroke-vidth:2 1) 
.CtlPoint ( fill:2888888, stroke:none ) 
.AutoctlPoint ( fill:none, stroke:blue, stroke-vidth:4 1) 
.Label 1 font-size:22, font-family:Verdana ) 
11:-/styles 





crect classe"Border" xe"1" y-"1" vidth-"498" height-"398" /5 


epolyline class-"Connect" pointsz"100,200 100,100" /5 
epolyline class-"Connect" pointsz"250, 100 250,200" /5 
epolyline class-"Connect" pointsz"250,200 250,300" /5 
epolyline class-"Connect" points-"400, 300 400,200" /5 


epath classe"SamplePath" d-"M100, 200 C100, 100 250, 100 250,200 
S400 300 400,200" /5 





ecircle class-"EndPoint" /5 
ecircle class-"EndPoint" /- 
ecircle class-"EndPoint" /- 
ecircle class-"CtlPoint" /- 
ecircle classe"CtlPoint" /- 
ecircle class-"CtlPoint" /- 


ecircle classe"AutoCtlPoint" cxze"250" cyze"300" rze"9" /s 
etext classe"Label" xe"25" yae"70"5M100,200 C100, 100 250, 100 250, 200-/text- 
etext classe"Label" xe"325" ye"350" 
styleze"text-anchor:middle"xS400, 300 400, 200-/text- 
x/ svg” 
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Example cubic01 


M100, 200 C100,100 250, 100 250,200 
. . 





The follovving picture shovvs some hovv cubic Bezier curves change their shape depending on the position of the 
control points. The first five examples illustrate a single cubic Bezier path segment. The example at the lovver right 
shovvs a "C" command feollovved by an "S" command. 





m 
LI . 
M100,500 C25,400 475,400 400,500 M600,500 C600, 350 900,650 900, 500 
pi 
R “ 


M100,800 C175,700 325,700 400,800 





M600,800 C625,700 725,700 750,800 
S875,900 900,800 


8.3.7 The quadratic Bözier curve commands 


The quadratic Bezier commands are as follovvs: 


İ command İ Name İ Parameters İ Description 


Dravvs a quadratic Bezier curve from the current point to (x,y) using 
(x1,y1) as the control point. Q (uppercase) indicates that absolute 
coordinates vvill follovv, q (lovvercase) indicates that relative 
coordinates vvill follovv. Multiple sets of coordinates may be 
specified to dravv a polybözier. At the end of the command, the nevv 
current point becomes the final (x,y) coordinate pair used in the 
polybezier. 
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Q quadratic 
(absolute) /İ Bezier (x1 y1 x y). 
q (relative) İ curveto 





Dravvs a quadratic Bezier curve from the current point to (x,y). The 
control point is assumed to be the reflection of the control point on 
the previous command relative to the current point. (If there is no 
previous command or if the previous command vvas not a Q, q, T or 
İ, assume the control point is coincident vvith the current point.) T 
(uppercase) indicates that absolute coordinates vill follovv, t 
(lovvercase) indicates that relative coordinates veill follovv. At the end 
of the command, the nevv current point becomes the final (x,y) 
coordinate pair used in the polybezier. 


Shorthand/ 
T smooth 
(absolute) /İ quadratic (x y). 
t (relative) 1 Bezier 
curveto 














Example quad01 shovvs some simple uses of quadratic Bezier commands vvithin a path. Note that the control point 
for the "T" command is computed automatically as the reflection of the control point for the previous "Q" com- 
mand relative to the start point of the "T" command. 


c?xml versionz"1.0" standalone-"no"?5 
x DOCTYPE svg PUBLİC "-//V/3C/ //DTD SVG 1.1//EN" 
"http: / /vvuv/ .vV3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
€svg vidthe"12cm" height-"6cm" vievBoxz"0 0 1200 600" 
xmlnse"http: / /uvv .vV3.org/2000/svg" versionze"1.1"5 
etitlesExample quad01 - quadratic Bözier commands in path datac/titles 
edescsPicture shoving a "Q" a "T" command, 
along vith annotations shoving the control points 
and end points-/desc” 
crect xe"1" y-"1" vidth-"1198" height-"598" 
fill-"none" strokez"blue" stroke-vidthe"1" /s 


xcpath d-"M200, 300 0400, 50 600,300 T1000, 300" 
fill-"none" strokez"red" stroke-vidthz"5" /s 
c1-- End points --s 
eg fill-"black" s 
ccircle cxz"200" cyz"300" rz"10"/5 
ccircle cxz"600" cyz"300" rz"10"/5 
ccircle cxz"1000" cyz"300" r-"10"/5 
x/g” 
c1-- Control points and lines from end points to control points --x 
sg fill-")888888" 5 
ccircle cxz"400" cyz"50" rz"10"/5 
ccircle cxz"800" cyz"550" rz"10"/5 
c/g” 
cpath d-"M200, 300 L400, 50 L600, 300 


L800 ,550 L1000 300" 
fill-"none" strokez"z888888" stroke-vidth-"2" /” 
xv/ svgx 


Example quad01 
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8.3.8 The elliptical arc curve commands 


"The elliptical arc commands are as follovvs: 


Dravvs an elliptical arc from the current point to (x, y). The size and 
orientation of the ellipse are defined by tvvo radii (rx, ry) and an 


(rx : ş ə : : 
: x-axis-rotation, vvhich indicates hovv the ellipse as a vvhole is 


A x-axis-rotation 


elliptical rotated relative to the current coordinate system. The center (cx, cy) 
(absolute) large-arc-flag “iə . 3 2 
arc of the ellipse is calculated automatically to satisfy the constraints 


a (relative) svveep-flag x 


.. imposed by the other parameters. large-arc-flag and svveep-flag 


contribute to the automatic calculations and help determine hovv the 
arc is dravvn. 





Example arcs01 shovvs some simple uses of arc commands vvithin a path. 


c?xml versionz"1.0" standalone-"no"?z 
x 1DOCTYPE svg PUBLİC "-//V/3C/ //DTD SVG 1.1//EN" 
"http: / /vvv/.v/3.org/Graphics/SVG/1.1/DTD/svg11.dtd"s 
s€svg vidth-"12cm" height-"5.25cm" vievBoxz"0 0 1200 400" 
xmlnsz"http: / /vuv/ .v3.0T9/2000/svg" versionz"1.1"5 
etitlesExample arcs01 - arc commands in path datac/titles 
cdescsPicture of a pie chart vith tuvo pie vedges and 
a picture of a line vith arc blips-c/desc” 
crect xe"1" y-"1" vidth-"1198" height-"398" 
fill-"none" strokez"blue" stroke-vidth-"1" /s 


cpath d-"M300, 200 h-150 a150, 150 0 1,0 150, -150 z" 
fill-"red" strokez"blue" stroke-vidthe"5" /5 
sepath d-"M275,175 v-150 a150, 150 0 0,0 -150,150 z" 


fille"yellov" strokeze"blue" stroke-vidthe"5" /s 


scpath d-"M600, 350 1 50,-25 
a25,25 -30 0,1 50,-25 1 50,-25 
a25,50 -30 0,1 50,-25 1 50,-25 
a25,75 -30 0,1 50,-25 1 50,-25 
a25, 100 -30 0,1 50,-25 1 50,-25" 
fill-"none" strokez"red" stroke-vidth-"5" /s 
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s/ svg” 


Example arcs01 





The elliptical are command dravvs a section of an ellipse vvhich meets the follovving constraints: 


e the arc starts at the current point 

e the arc ends at point (x, y) 

e the ellipse has the tvvo radii (rx, ry) 

e the x-axis of the ellipse is rotated by x-axis-rotation relative to the x-axis of the current coordinate system. 


For most situations, there are actually four different arcs (tvvo different ellipses, each vvith tvvo different arc svveeps) 
that satisfy these constraints. large-arc-flag and svveep-flag indicate vvhich one of the four arcs are dravvn, as 


follovvs: 


e OT the four candidate arc svveeps, tvvo vvill represent an arc svveep of greater than or equal to 180 degrees 
(the "large-arc"), and tvvo vvill represent an arc svveep of less than or equal to 180 degrees (the "small-arc"). If 
large-are-flag is "T, then one of the tvvo larger arc svveeps vvill be chosen: othervvise, if large-arc-flag is "0, 
one of the smaller arc svveeps vvill be chosen, 

e If svveep-flag is "1" then the arc vvill be dravrn in a "positive-angle" direction (i.e., the ellipse formula 
x-cx-rx”cos(theta) and y-cy-ry”sin(theta) is evaluated such that theta starts at an angle corresponding to 
the current point and increases positively until the arc reaches (x,y)). A value of 0 causes the arc to be dravvn 
in a "negative-angle" direction (i.e., theta starts at an angle value corresponding to the current point and de- 


creases until the arc reaches (x,y)). 


"The follovving illustrates the four combinations of large-arc-flag and svveep-flag and the four different arcs that 
vvill be dravvn based on the values of these flags. For each case, the follovving path data command vvas used: 


xpath d-"M 125, 75 a100,50 0 ?,? 100,50" 
style-"fill:none, stroke:red, stroke-vidth:6"/” 


vvhere "?,2" is replaced by "0,0" "0,1" "1,0" and "1,1" to generate the four possible cases. 
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large-arc-flag-0 
suveep-fiag -0 


drc start 


irz endi 





large-arc-flag-ı large-arc-fiag-1 
svveep-fiag -0 svveep-flag-i 





Refer to Elliptical arc implementation notes for detailed implementation notes for the path data elliptical arc com- 


mands. 


8.3.9 The grammar for path data 
The follovving notation is used in the Backus-Naur Form (BNF) description of the grammar for path data: 


ə “:0 or more 

s 1 :0r more 

e 7:00r1 

" Ü: grouping 

e İ: separates alternatives 

e double quotes surround literals 


"The follovving is the BNF for SVG paths. 


Svg-path: 

v/Ssp” moveto-dravto-command-groups? v/sp” 
moveto-drav/to-command-groups: 

moveto-drav/to- command-group 

İ moveto-drav/to- command-group vsp” möveto-dravto-command-groups 
moveto-dravto-command-group: 

moveto vsp” dravto-commands? 
dravto-commands: 

dravto- command 

İ dravto- command usp” dravto-commands 
dravto-command: 

closepath 

İ lineto 

İ horizontal-lineto 

İ vertical-lineto 


İ curveto 

İ smooth-curveto 

İ quadratic-bezier-curveto 

İ smooth-quadratic-bezier-curveto 

I elliptical-arc 
moveto: 

( "M" 1 "m" ) vvsp” möveto-argument-sequence 
moveto-argument-sequence: 

coordinate-pair 

İ coordinate-pair comma-uvsp? lineto-argument-sequence 
closepath: 

(52"-129) 
lineto: 

( "L" 1 "1" ) sp” lineto-argument-sequence 
lineto-argument -sequence: 

coordinate-pair 

İ coordinate-pair comma-uvsp? lineto-argument-sequence 
horizontal-lineto: 
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( "H" 1 "h" ) vsp” horizontal-lineto-argument-sequence 
horizontal-lineto-argument-sequence: 
coordinate 


İ coordinate comma-v.sp? horizontal-lineto-argument -sequence 
vertical-lineto: 

( "V" 1 "v" ) sp” vertical-lineto-argument-sequence 
vertical-lineto-argument -sequence: 

coordinate 

İ coordinate comma-v.sp? vertical-lineto-argument-sequence 
curveto: 

( "C" 1 "c" ) sp” cürveto-argument-sequence 
curveto-argument-sequence: 

curveto-argument 

İ curveto-argument comma-vsp? curveto-argument-sequence 
curveto-argument: 

coordinate-pair comma-vsp? coordinate-pair comma-vsp? coordinate-pair 
smooth-curveto: 

( "S" 1 "s" ) vsp” smooth-curveto-argument-sequence 
smooth-curveto-argument-sequence: 

smooth-curveto-argument 

İ smooth-curveto-argument comma-v/.sp? smooth-curveto-argument-sequence 
smooth-curveto-argument: 

coordinate-pair comma-vsp? coordinate-pair 
quadratic-bezier-curveto: 

( "Q" 1 "q" ) sp” quadratic-bezier-curveto-argument-sequence 
quadratic-bezier-curveto-argument-sequence: 

quadratic-bezier-curveto-argument 

İ quadratic-bezier-curveto-argument comma-vsp? 

quadratic-bezier-curveto-argument-sequence 

quadratic-bezier-curveto-argument: 

coordinate-pair comma-vsp? coordinate-pair 
smooth-quadratic-bezier-curveto: 

( "T" 1 "t" ) vsp” smooth-quadratic-bezier-curveto-argument-sequence 
smooth-quadratic-bezier-curveto-argument-sequence: 

coordinate-pair 

İ coordinate-pair comma-v/sp? smooth-quadratic-bezier-curveto-argument - sequence 
elliptical-arc: 

( "A" 1 "a" ) vsp” elliptical-arc-argument-sequence 
elliptical-arc-argument-sequence: 

elliptical-arc-argument 


Iİ elliptical-arc-argument comma-vvsp? elliptical-arc-argument- sequence 
elliptical-arc-argument: 

nonnegative-number comma-vsp? nonnegative-number comma -vsp? 

number comma-v.sp f1ag comma-v.sp? flag comma-vsp? coordinate-pair 

coordinate-pair: 

coordinate comma-vsp? coordinate 
coordinate: 

number 
nonnegative-number: 

integer-constant 

Iİ floating-point-constant 
number: 

sign? integer-constant 

İ sign? floating-point-constant 
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Tlag: 

"0" l "" 
comma -vsp: 

(vSp comma? v/sp”) 1 (comma v/sp”) 
comma : 


integer-constant: 
digit-sequence 
floating-point-constant: 
Tractional-constant exponent? 
İ digit-sequence exponent 
fractional-constant: 


digit-sequence? "." digit-sequence 
İ digit-sequence "." 
exponent: 
( "e" 1 "E" ) sign? digit-sequence 
sign: 
"5." l "”.." 
digit-sequence: 
digit 
İ digit digit-sequence 
digit: 
"gn" lo"l1" 1 :"2" 1: "3" İ "4" / "5" 1 "6" İ "7" 1 "8" 1 "9" 
vSp 


(4x20 1 4”x9 1 £xD 1 £xA) 


"The processing of the BNF must consume as much of a given BNF production as possible, stopping at the point 
vvhen a character is encountered vvhich no longer satisfies the production. Thus, in the string "M 100-200", the first 
coordinate for the "moveto" consumes the characters "100" and stops upon encountering the minus sign because 
the minus sign cannot follovr a digit in the production of a "coordinate". The result is that the first coordinate vvill 
be "100" and the second coordinate vvill be "-200". 

Similarly, for the string "M 0.6.5", the first coordinate of the "moveto" consumes the characters "0.6" and stops 
upon encountering the second decimal point because the production of a "coordinate" only allovvs one decimal 
point. The result is that the first coordinate vvill be "0.6" and the second coordinate vvill be ".5". 

Note that the BNF allovvs the path “d” attribute to be empty. This is not an error, instead it disables rendering 
of the path. 
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8.4 Distance along a path 


Various operations, including text on a path and motion animation and various stroke operations, require that the 
user agent compute the distance along the geometry of a graphics element, such as a Tath”. 

Exact mathematics exist for computing distance along a path, but the formulas are highly complex and re- 
quire substantial computation. İt is recommended that authoring products and user agents employ algorithms that 
produce as precise results as possible, hovvever, to accommodate implementation differences and to help distance 
calculations produce results that approximate author intent, the “pathLength” attribute can be used to provide the 
author"s computation of the total length of the path so that the user agent can scale distance-along-a-path compu- 
tations by the ratio of “pathLength” to the user agent"s ovvn computed value for total path length. 


"." 


A "moveto" operation vvithin a “path” element is defined to have zero length. Only the various "lineto", "cur- 
veto" and "arcto" commands contribute to path length calculations. 


8.5 DOM interfaces 


8.5.1 Interface SVGPathSeg 


The SVGPathSeg interface is a base interface that corresponds to a single command vvithin a path data specifica- 
tion. 


interface SV6PathSeg ( 


// Path Segment Types 

const unsigned short PATHSEG UNKNOMN £ 0, 
const unsigned short PATHSEG CLOSEPATH £ 1, 
const unsigned short PATHSEG MOVET0 ABS c 2, 
const unsigned short PATHSEG MOVET0 REL £ 3, 
const unsigned short PATHSEG LTNET0 ABS c 4, 
const unsigned short PATHSEG LTNETÜ0 REL z 5 
const unsigned short PATHSEG CURVETO CUBIC ABS £— 6, 
const unsigned short PATHSEG CURVETO CUBIC REL £ 7, 
const unsigned short PATHSEG CURVETO QUADRATIC ABS 
const unsigned short PATHSEG CURVETO QUADRATIC REL 
const unsigned short PATHSEG ARC ABS £ 10, 

const unsigned short PATHSEG ARC REL £ 11, 

const unsigned short PATHSEG LINETO HORTZONTAL ABS K 12, 

const unsigned short PATHSEG LINETO HORTZONTAL REL £ 13, 

const unsigned short PATHSEG LINETO VERTTCAL ABS £ 14, 

const unsigned short PATHSEG LINETO VERTTCAL REL c 15, 

const unsigned short PATHSEG CURVETO CUBIC SMOOTH ABS — 16, 
const unsigned short PATHSEG CURVETO CUBIC SMOOTH REL £ 17, 
const unsigned short PATHSEG CURVETO QUADRATIC SMOOTH ABS £ 18, 
const unsigned short PATHSEG CURVETO QUADRATIC SMOOTH REL £ 19, 


readonly attribute unsigned short pathSegType, 
readonly attribute DOMString pathSegTypeAsLetter, 
y 
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Constants in group “Path Segment Types”: 


e PATHSEG UNKNOVVN (ınsigned short) 


The unit type is not one of predefined types. İt is invalid to attempt to define a nevv value of this type or to 
attempt to svvitch an existing value to this type. 


e PATHSEG CLOSEPATH (unsigned short) 


Corresponds to a "closepath" (z) path data command. 


e PATHSEG MOVETO ABS (funsigned short) 


Corresponds to a "absolute moveto" (M) path data command. 


" PATHSEG MOVETO REL (unsigned short) 


Corresponds to a "relative moveto" (m) path data command. 


" PATHSEG LINETO. ABS (unsigned short) 


Corresponds to a "absolute lineto" (L) path data command. 


“" PATHSEG LINETO REL (unsigned short) 


Corresponds to a "relative lineto" (1) path data command. 


e PATHSEG CURVETO CUBIC ABS (unsigned short) 


Corresponds to a "absolute cubic Bezier curveto" (C) path data command. 


e PATHSEG CURVETO CUBIC REL (unsigned short) 


Corresponds to a "relative cubic Bözier curveto" (c) path data command. 


" PATHSEG CURVETO QUADRATIC. ABS (unsigned short) 


Corresponds to a "absolute quadratic Bözier curveto" (Q) path data command. 


" PATHSEG CURVETO QUADRATIC REL (unsigned short) 


Corresponds to a "relative quadratic Bezier curveto" (q) path data command. 


e PATHSEG ARC ABS (unsigned short) 


Corresponds to a "absolute arcto" (A) path data command. 


e PATHSEG ARC REL (unsigned short) 
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Corresponds to a "relative arcto" (a) path data command. 


e PATHSEG LINETO HORİZONTAL ABS (ınsigned short) 


Corresponds to a "absolute horizontal lineto" (H) path data command. 


" PATHSEG LINETO HORIZONTAL REL (unsigned short) 





Corresponds to a "relative horizontal lineto" (h) path data command. 


e PATHSEG LINETO VERTİICAL ABS (ınsigned short) 


Corresponds to a "absolute vertical lineto" (V) path data command. 


“" PATHSEG. LINETO VERTICAL REL (unsigned short) 


Corresponds to a "relative vertical lineto" (v) path data command. 


e PATHSEG CURVETO CUBIC SMOOTH, ABS (unsigned short) 


Corresponds to a "absolute smooth cubic curveto" (S) path data command. 


e PATHSEG CURVETO CUBIC SMOOTH, REL (ınsigned short) 


Corresponds to a "relative smooth cubic curveto" (s) path data command. 


" PATHSEG CURVETO QUADRATIC SMOOTH ASS (unsigned short) 


Corresponds to a "absolute smooth quadratic curveto" (T) path data command. 


" PATHSEG CURVETO QUADRATIC SMOOTH REL (unsigned short) 


Corresponds to a "relative smooth quadratic curveto" (t) path data command. 


Aftributes: 


e pathSegType (readonly unsigned short) 
"The type of the path segment as specifled by one of the constants defined on this interface. 
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e pathSegTypeAslLetter (readonly DOMString) 


"The type of the path segment, specifted by the corresponding one character command name. 


8.5.2 Interface SVGPathSegClosePath 


The SVGPathSegClosePath interface corresponds to a "closepath" (z) path data command. 





interface SV6PathSegClosePath : SVGPathSeg 1 
y 


8.5.3 Interface SVGPathSegMovetoAbs 


The SVGPathSegMovetoAbs interface corresponds to an "absolute moveto" (M) path data command. 


interface SV6PathSegMovetoAbs : SVGPathSeg ( 
attribute float x setraises(DÜMException), 
attribute float y setraises(DÜMException) , 
y 


Attributes: 


e X (float) 


"The absolute X coordinate for the end point of this path segment. 


Exceptions on setting 


e DOMException, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e y (float) 
"The absolute Y coordinate for the end point of this path segment. 


Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


8.5.4 Interface SVGPathSegMovetoRel 


The SVGPathSegMovetoRel interface corresponds to a "relative moveto" (m) path data command. 


interface SV6PathSegMovetoRel : SVGPathSeg 1 
attribute float x setraises(DOMException), 
attribute float y setraises(DOMException), 
y 
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Aftributes: 


e x (float) 


"The relative X coordinate for the end point of this path segment. 





Exceptions on setting 
e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 


Raised on an attempt to change the value of a read only attribute. 


e y (float) 
"The relative Y coordinate for the end point of this path segment. 


Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


8.5.5 Interface SVGPathSegLinetoAbs 


The SVGPathSegLinetoAbs interface corresponds to an "absolute lineto" (L) path data command. 


interface SV6PathSegLinetoAbs : SVGPathSeg ( 
attribute float x setraises(DOMException), 
attribute float y setraises(DÜMException), 
y 


Aftributes: 


e x (float) 


"The absolute X coordinate for the end point of this path segment. 
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Exceptions on setting 
e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 


Raised on an attempt to change the value of a read only attribute. 


e y (float) 


"The absolute Y coordinate for the end point of this path segment. 


Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


8.5.6 Interface SVGPathSegLinetoRel 


The SVGPathSeglLinetoRel interface corresponds to a "relative lineto" (1) path data command. 


interface SV6GPathSegLinetoRel : SVGPathSeg ( 
attribute float x setraises(DÜMException), 
attribute float y setraises(DÜMException), 
i 


Attributes: 


e x (float) 


"The relative X coordinate for the end point of this path segment. 


Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e y (float) 
"The relative Y coordinate for the end point of this path segment. 


Exceptions on setting 


e DOMException, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


8.5.7 Interface SVGPathSegCurvetoCubicAbs 


The SVGPathSegCurvetoCubicAbs interface corresponds to an "absolute cubic Bezier curveto" (C) path data com- 


mand. 
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interface SVGPathSegCurvetoCubicAbs : SVGPathSeg ( 
attribute float x setraises(DOMException), 
attribute float y setraises(DÜMException), 
attribute float x1 setraises(DÜMException), 
attribute float y1 setraises(DOMException), 
attribute float x2 setraises(DÜUMException), 
attribute float y2 setraises(DÜüMException) , 

y 


Aftributes: 





e x (float) 


"The absolute X coordinate for the end point of this path segment. 
Exceptions on setting 


e DOMException, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e y (float) 
"The absolute Y coordinate for the end point of this path segment. 
Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e X1 (float) 
"The absolute X coordinate for the first control point. 
Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e y1 (float) 


"The absolute Y coordinate for the first control point. 


Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 
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e X2 (float) 


"The absolute X coordinate for the second control point. 
Exceptions on setting 


e DOMException, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 





e y2 (float) 


"The absolute Y coordinate for the second control point. 
Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


8.5.8 Interface SVGPathSegCurvetoCubicRel 


The SVGPathSegCurvetoCubicRel interface corresponds to a "relative cubic Bezier curveto" (c) path data com- 
mand. 


interface SVGPathSegCurvetoCubicRel : SVGPathSeg ( 
attribute float x setraises(DÜMException) , 
attribute float y setraises(DÜMException) , 
attribute float x1 setraises(DÜüMException), 
attribute float y1 setraises(DOüMException), 
attribute float x2 setraises(DOMException) , 
attribute float y2 setraises(DÜüMException) , 

y 


Aftributes: 


e x (float) 


"The relative X coordinate for the end point of this path segment. 
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Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e y (float) 
"The relative Y coordinate for the end point of this path segment. 


Exceptions on setting 


e DOMException, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e X1 (float) 
"The relative X coordinate for the first control point. 
Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e y1 (float) 
"The relative Y coordinate for the first control point. 
Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e X2 (float) 
"The relative X coordinate for the second control point. 
Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 
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e Yy2 (float) 


"The relative Y coordinate for the second control point. 
Exceptions on setting 


e DOMException, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


8.5.9 Interface SVGPathSegCurvetoQuadraticAbs 


The SVGPathSegCurvetoQuadraticAbs interface corresponds to an "absolute quadratic Bezier curveto" (Q) path 
data command. 


interface SV6PathSegCurvetoQuadraticAbs : SVGPathSeg 1 
attribute float x setraises(DÜMException), 

attribute float y setraises(DÜMException) , 

attribute float x1 setraises(DÜüMException), 
attribute float y1 setraises(DÜMException), 

y 


Aftributes: 


e x (float) 


"The absolute X coordinate for the end point of this path segment. 


Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e y (float) 
"The absolute Y coordinate for the end point of this path segment. 
Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


ə X1 (float) 


"The absolute X coordinate for the first control point. 


Exceptions on setting 


e DOMEvxception, code NO MODIHFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


c 
.o 
5 
İv) 
m") 
s 
(3) 
z 
E 
ə) 
(ə) 
o 
ad 
. 
s 


e y1 (float) 


"The absolute Y coordinate for the first control point. 


Exceptions on setting 


e DOMEvxception, code NO MODIHFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 





8.5.10 Interface SVGPathSegCurvetoQuadraticRel 


The SVGPathSegCurvetoQuadraticRel interface corresponds to a "relative quadratic Bezier curveto" (q) path data 


command. 


interface SV6PathSegCurvetoQuadraticRel : SVGPathSeg 1 
attribute float x setraises(DÜMException) , 

attribute float y setraises(DÜMException) , 

attribute float x1 setraises(DÜüMException), 
attribute float y1 setraises(DÜüMException), 

y 


Aftributes: 


ə x (float) 


"The relative X coordinate for the end point of this path segment. 


Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e y (float) 
"The relative Y coordinate for the end point of this path segment. 


Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e X1 (float) 


"The relative X coordinate for the first control point. 


Exceptions on setting 
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e DOMException, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e y1 (float) 


"The relative Y coordinate for the first control point. 





Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


8.5.11 Interface SVGPathSegArcAbs 


The SVGPathSegArcAbs interface corresponds to an "absolute arcto" (A) path data command. 


interface SVU6PathSegArcAbs : SVGPathSeg ( 
attribute float x setraises(DÜMException), 
attribute float y setraises(DÜMException), 
attribute float r1 setraises(DÜMException), 
attribute float r2 setraises(DÜüMException) , 
attribute float angle setraises (D0MException), 
attribute boolean 1argeArcFlag setraises (DOMException) , 
attribute boolean sveepFlag setraises(D0üMException), 
y 


Aftributes: 


e x (float) 


"The absolute X coordinate for the end point of this path segment. 
Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e y (float) 
"The absolute Y coordinate for the end point of this path segment. 


Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 
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e T1 (float) 


"The x-axis radius for the ellipse (i.e., r1). 
Exceptions on setting 


e DOMException, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 





e T2 (float) 


"The y-axis radius for the ellipse (i.e., 2). 
Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e angle (float) 
"The rotation angle in degrees for the ellipse"s x-axis relative to the x-axis of the user coordinate system. 


Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e largeArcFlag (boolean) 
"The value of the large-arc-flag parameter. 
Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 
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e svveepFlag (boolean) 


"The value of the svveep-flag parameter. 
Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


8.5.12 Interface SVGPathSegArcRel 


The SVGPathSeg.AreRel interface corresponds to a "relative arcto" (a) path data command. 


interface SV6PathSegArcRel : SVGPathSeg ( 
attribute float x setraises(DÜMException), 
attribute float y setraises(DÜMException), 
attribute float r1 setraises(DOMException), 
attribute float r2 setraises (DOMException) , 
attribute float angle setraises (DOÜMException), 
attribute boolean 1argeArcFlag setraises (DOMException) , 
attribute boolean sveepFlag setraises(D0üMException), 
R 


Attributes: 


e x (float) 


"The relative X coordinate for the end point of this path segment. 
Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e y (float) 
"The relative Y coordinate for the end point of this path segment. 
Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e T1 (float) 


"The x-axis radius for the ellipse (i.e., r1). 


Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 
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e T2 (float) 


"The y-axis radius for the ellipse (i.e., T2). 
Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 





e angle (float) 


"The rotation angle in degrees for the ellipse"s x-axis relative to the x-axis of the user coordinate system. 
Exceptions on setting 


e DOMEvxception, code NO MODIHFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e largeArcFlag (boolean) 
"The value of the large-arc-flag parameter. 
Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e svveepFlag (boolean) 
"The value of the svveep-flag parameter. 
Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 
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8.5.13 Interface SVGPathSegLinetoHorizontalAbs 


The SVGPathSegLinetoHorizontalAbs interface corresponds to an "absolute horizontal lineto" (H) path data com- 
mand. 


interface SV6PathSegLinetoHorizontalAbs : SVGPathSeg 1 
attribute float x setraises(DOMException), 
y 


Aftributes: 


e x (float) 


The absolute X coordinate for the end point of this path segment. 


Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


8.5.14 Interface SVGPathSegLinetoHorizontalRel 


The SVGPathSegLinetoHorizontalRel interface corresponds to a "relative horizontal lineto" (h) path data com- 


mand. 


interface SV6PathSegLinetoHorizontalRel : SVGPathSeg 1 
attribute float x setraises(DOMException), 
y 


Attributes: 


e x (float) 


"The relative X coordinate for the end point of this path segment. 


Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


8.5.15 Interface SVGPathSegLinetoVerticalAbs 


The SVGPathSeglLinetoVerticalAbs interface corresponds to an "absolute vertical lineto" (V) path data command. 


interface SV6PathSegLinetoVerticalAbs : SVGPathSeg ( 


attribute float y setraises(DÜMException), 


Aftributes: 
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e y (float) 
"The absolute Y coordinate for the end point of this path segment. 


Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 





8.5.16 Interface SVGPathSegLinetoVerticalRel 


The SVGPathSeglLinetoVerticalRel interface corresponds to a "relative vertical lineto" (v) path data command. 


interface SV6PathSegLinetoVerticalRel : SVGPathSeg ( 
attribute float y setraises(DÜMException) , 


Aftributes: 


e y (float) 
"The relative Y coordinate for the end point of this path segment. 


Exceptions on setting 


e DOMException, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


8.5.17 Interface SVGPathSegCurvetoCubicSmoothAbs 


The SVGPathSegCurvetoCubicSmoothAbs interface corresponds to an "absolute smooth cubic curveto" (S) path 
data command. 


interface SV6PathSegCurvetoCubicSmoothAbs : SVGPathSeg ( 
attribute float x setraises(DOMException), 

attribute float y setraises(DÜUMException), 

attribute float x2 setraises(DÜMException), 

attribute float y2 setraises(DOMException) , 

y 


Aftributes: 


e x (float) 


"The absolute X coordinate for the end point of this path segment. 
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Exceptions on setting 


e DOMException, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e y (float) 
"The absolute Y coordinate for the end point of this path segment. 





Exceptions on setting 


e DOMEvxception, code NO MODIHFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e X2 (float) 
"The absolute X coordinate for the second control point. 
Exceptions on setting 


e DOMEvxception, code NO MODIHFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e y2 (float) 
"The absolute Y coordinate for the second control point. 
Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


8.5.18 Interface SVGPathSegCurvetoCubicSmoothRel 


The SVGPathSegCurvetoCubicSmoothRel interface corresponds to a "relative smooth cubic curveto" (s) path data 


command. 


interface SV6PathSegCurvetoCubicSmoothRel : SVGPathSeg ( 
attribute float x setraises(DÜMException), 

attribute float y setraises(DÜMException) , 

attribute float x2 setraises(DÜüMException), 

attribute float y2 setraises(DÜMException) , 

y 
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Aftributes: 


e X (float) 


"The relative X coordinate for the end point of this path segment. 


Exceptions on setting 





e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e y (float) 
"The relative Y coordinate for the end point of this path segment. 
Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e X2 (float) 
"The relative X coordinate for the second control point. 
Exceptions on setting 


e DOMException, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e y2 (float) 
The relative Y coordinate for the second control point. 
Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


8.5.19 Interface SVGPathSegCurvetoQuadraticSmoothAbs 


The SVGPathSegCurvetoQuadraticSmoothAbs interface corresponds to an "absolute smooth cubic curveto" (T) 
path data command. 
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interface SV6PathSegCurvetoQuadraticSmoothAbs : SVGPathSeg 1 
attribute float x setraises(DOMException), 
attribute float y setraises(DÜMException), 
y 


Attributes: 


e x (float) 


"The absolute X coordinate for the end point of this path segment. 





Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e y (float) 
"The absolute Y coordinate for the end point of this path segment. 


Exceptions on setting 


e DOMException, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


8.5.20 Interface SVGPathSegCurvetoQuadraticSmoothRel 


The SVGPathSegCurvetoQuadraticSmoothRel interface corresponds to a "relative smooth cubic curveto" (t) path 
data command. 


interface SV6PathSegCurvetoQuadraticSmoothRel : SVGPathSeg 1 
attribute float x setraises(DÜMException), 
attribute float y setraises(DÜMException) , 
y 


Aftributes: 


ə X (float) 


"The relative X coordinate for the end point of this path segment. 


Exceptions on setting 


e DOMEvxception, code NO MODIHFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 
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e y (float) 


"The relative Y coordinate for the end point of this path segment. 
Exceptions on setting 


e DOMException, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 





8.5.21 Interface SVGPathSegtList 


This interface defines a list of SVGPathSeg obiects. 
SVGPathSeglist has the same attributes and methods as other SVGxxxlist interfaces. Implementers may con- 
sider using a single base class to implement the various SVGxxxList interfaces. 


interface SVGPathSegList ( 
readonly attribute unsigned long numberOfTtems, 
void clear() raises(DÜMException) , 
SVGPathSeg initialize(in SVGPathSeg nevItem) raises(DOüMException), 
SVGPathSeg getItem(in unsigned long index) raises(DOMException) , 
SVGPathSeg insertItemBefore(in SVGPathSeg nevItem, in unsigned long index) raises(D0MException), 
SVGPathSeg replaceltem(in SVGPathSeg nevItem, in unsigned long index) raises(DOMException) , 
SVGPathSeg removeTtem(in unsigned long index) raises(DOMException), 


SVGPathSeg appendItem(in SVGPathSeg nev/Ttem) raises (DOMException) , 
y 


Aftributes: 


e numberOfltems (readonly unsigned long) 


The number of items in the list. 
Operations: 


e void clear() 


Clears all existing current items from the list, vvith the result being an empty list. 
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Exceptions 


e DOMException, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list cannot be modifted. 


SVGPathsSeg initialize(in SVGPathSeg nevltem) 


Clears all existing current items from the list and re-initializes the list to hold the single item specifted by 
the parameter. If the inserted item is already in a list, it is removed from its previous list before it is inserted 
into this list. The inserted item is the item itself and not a copy. 


Parameters 


e SVGPathSeg nevvltem 
"The item vvhich should become the only member of the list. 


Returns 
"The item being inserted into the list. 


Exceptions 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list cannot be modifted. 


SVGPathSeg getltem(in unsigned long index) 


Returns the specifted item from the list. The returned item is the item itself and not a copy. Any changes 
made to the item are immediately reflected in the list. 


Parameters 


e unsigned long index 
The index of the item from the list vvhich is to be returned. The first item is number 0. 


Returns 
"The selected item. 


Exceptions 


e DOMEvxception, code INDEX SIZE ERR 
Raised if the index number is greater than or equal to numberOfltems. 


c 
.o 
5 
İv) 
m") 
ss 
(3) 
z 
E 
ə) 
(ə) 
(3) 
ad 
. 
s 





SVGPathSeg insertİtemBefore(in SVGPathSeg nevvltem, in unsigned long index) 


mserts a nevv item into the list at the specifted position. The first item is number 0. If nevvltem is already in 
a list, it is removed from its previous list before it is inserted into this list. The inserted item is the item itself 
and not a copy. If the item is already in this list, note that the index of the item to insert before is before the 
removal of the item. 


Parameters 


ə SVGPathSeg nevvltem 
The item vvhich is to be inserted into the list. 


e unsigned long index 
The index of the item before vvhich the nevv item is to be inserted. "The first item is number 0. If the 
index is equal to 0, then the nevv item is inserted at the front of the list. If the index is greater than or 
equal to numberOfltems, then the nevv item is appended to the end of the list. 


Returns 
"The inserted item. 


Exceptions 


e DOMException, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list cannot be modifted. 


SVGPathSeg replaceltem(in SVGPathSeg nevvİtem, in unsigned long index) 


Replaces an existing item in the list vvith a nevv item. If nevvİtem is already in a list, it is removed from its 
previous list before it is inserted into this list. The inserted item is the item itself and not a copy. If the item 
is already in this list, note that the index of the item to replace is before the removal of the item. 


Parameters 


e SVGPathSeg nevvltem 
The item vvhich is to be inserted into the list. 


e unsigned long index 
The index of the item vvhich is to be replaced. The first item is number 0. 


Returns 
"The inserted item. 
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Exceptions 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list cannot be modifted. 


e DOMEvxception, code INDEX SIZE ERR 


Raised if the index number is greater than or equal to numberOfltems. 


e SVGPathSeg removeltemtin unsigned long index) 


Removes an existing item from the list. 
Parameters 


e unsigned long index 
The index of the item vvhich is to be removed. The first item is number 0. 


Returns 
The removed item. 


Exceptions 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list cannot be modifted. 


e DOMEvxception, code INDEX SIZE ERR 


Raised if the index number is greater than or equal to numberOfltems. 


e SVGPathSeg appenditem(in SVGPathSeg nevvftem) 


mserts a nevv item at the end of the list. If nevvİtem is already in a İist, it is removed from its previous list 
before it is inserted into this list. The inserted item is the item itself and not a copy. 


Parameters 


e SVGPathSeg nevvltem 
"The item vvhich is to be inserted. The first item is number 0. 


Returns 
"The inserted item. 
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Exceptions 


e DOMException, code NO MODIFICATION ALLOVVED ERR 
Raised vvhen the list cannot be modifted. 


8.5.22 Interface SVGAnimatedPathData 


The SVGAnimatedPathData interface supports elements vvhich have a “d” attribute vvhich holds SVG path data, 
and supports the ability to animate that attribute. 

The SVGAnimatedPathData interface provides tvvo lists to access and modify the base (i.e., static) contents of 
the “d” attribute: 


e DOM attribute pathSeglist provides access to the static/base contents of the “d” attribute in a form vvhich 
matches one-for-one vvith SVG"s syntax. 

e DOM attribute normalizedPathSeglList provides normalized access to the static/base contents of the “d” 
attribute vvhere all path data commands are expressed in terms of the follovving subset of SVGPathSeg 
types: SVG PATHSEG MOVETO ABS (M), SVG PATHSEG LINETO ABS (L), 
SVG PATHSEG CURVETO CUBIC ABS (C) and SVG PATHSEG CLOSEPATH (z). 


and tvvo lists to access the current animated values of the “d” attribute: 


ə DOM attribute animatedPathSeglist provides access to the current animated contents of the “d” attribute in a 
form vvhich matches one-for-one vvith SVG"s syntax. 

ə. DOM attribute animatedNormalizedPathSeglist provides normalized access to the current animated contents 
of the “d” attribute vvhere all path data commands are expressed in terms of the follovving subset of 
SVGPathSeg types: SVG PATHSEG MOVETO ABS (M), SVG PATHSEG LİNETO ABS (L), 
SVG PATHSEG CURVETO CUBIC ABS (C) and SVG PATHSEG CLOSEPATH (z). 


Each of the tvvo İists are alvvays kept synchronized. Modifications to one list vvill immediately cause the cor- 
responding list to be modifted. Modifications to normalizedPathSeglList might cause entries in pathSeglist to be 
broken into a set of normalized path segments. 

Additionally, the “d” attribute on the “path” element accessed via the XML DOM f(e.g., using the getAttrib- 
ute() method call) vvill reflect any changes made to pathSeglist or normalizedPathSeglist. 


interface SVGAnimatedPathData 1 

readonly attribute SVGPathSegList pathSegList, 

readonly attribute SVGPathSegList normalizedPathSegList, 
readonly attribute SVGPathSegList animatedPathSegList, 

readonly attribute SVGPathSegList animatedNormalizedPathSegList, 
y 


Aftributes: 


e pathSeglist (readonly SVGPathSeglist) 


Provides access to the base (i.e., static) contents of the “d” attribute in a form vvhich matches one-for- 
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one vvith SVG"s syntax. Thus, if the “d” attribute has an "absolute moveto (M)" and an "absolute arcto 
(A)" command, then pathSeglList vvill have tvvo entries: a SVG PATHSEG MOVETO ABS and a 
SVG PATHSEG ARC ABS. 


normalizedPathSeglist (readonly SVGPathsSeglist) 


Provides access to the base (i.e., static) contents of the “d” attribute in a form vvhere all path data commands 
are expressed in terms of the follovving subset of SVGPathSeg types: SVG PATHSEG MOVETO ABS 
(M), SVG PATHSEG LINETO ABS (L), SVG PATHSEG CURVETO CUBİC ABS (C) and 
SVG PATHSEG CLOSEPATH (z). Thus, if the “d” attribute has an "absolute moveto (M)" and an "absolute 
arcto (A)" command, then pathSeglist vvill have one SVG PATHSEG MOVETO ABS entry follovved by a 
series of SVG PATHSEG LINETO ABS entries vvhich approximate the arc. This alternate representation is 
available to provide a simpler interface to developers vrho vvould benefit from a more limited set of com- 





mands. 

The only valid SVGPathSeg types are SVG PATHSEG MOVETO ABS (M), 
SVG PATHSEG LINETO ABS (L), SVG PATHSEG CURVETO CUBIC ABS (C) and 
SVG PATHSEG CLOSEPATH (z). 


animatedPathSeglist (readonly SVGPathSeglist) 


Provides access to the current animated contents of the “d” attribute in a form vvhich matches one-for-one 
vvith SVG"s syntax. If the given attribute or property is being animated, contains the current animated value 
of the attribute or property, and both the obiect itself and its contents are read only. If the given attribute or 
property is not currently being animated, contains the same value as pathSeglist. 


animatedNormalizedPathSeglist (readonly SVGPathSeglist) 


Provides access to the current animated contents of the “d” attribute in a form vvhere all path data commands 
are expressed in terms of the follovving subset of SVGPathSeg types: SVG PATHSEG MOVETO ABS 
(M), SVG PATHSEG LINETO ABS (L), SVG PATHSEG CURVETO CUBİC ABS (C) and 
SVG PATHSEG CLOSEPATH (z). If the given attribute or property is being animated, contains the current 
animated value of the attribute or property, and both the obyect itself and its contents are read only. 
If the given attribute or property is not currently being animated, contains the same value as normal- 
izedPathSeglist. 


8.5.23 Interface SVGPathElement 


The SVGPathElement interface corresponds to the “path” element. 


interface SV6PathElement : SVGElement, 
SVGTests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVGStylable, 
SVGTransformable, 
SVGAnimatedPathData 1 


c 
.Ə 
5 
İv) 
m") 
cc 
(3) 
E 
E 
ə) 
(ə) 
o 
ad 
. 
5 


readonly attribute SVGAnimatedNumber pathLength, 


Tloat getTotalLength(), 

SV6GPoint getPointAtLength(in float distance), 

unsigned long getPathSegAtLength(in float distance), 

SVGPathSegClosePath createSVGPathSegClosePath() , 

SVGPathSegMovetoAbs createSVGPathSegMovetoAbs(in float x, in float y), 

SVGPathSegMovetoRel createSVGPathSegMovetoRel(in float x, in float y), 

SVGPathSegLinetoAbs createSVGPathSegLinetoAbs(in float x, in float y), 

SVGPathSegLinetoRel createSVGPathSegLinetoRel(in float x, in float y), 

SVGPathSegCurvetoCubicAbs createSVGPathSegCurvetoCubicAbs(in float x, in float y, in float x1, in float y1, in float 
x2, in float y2), 

SVGPathSegCurvetoCubicRel createSVGPathSegCurvetoCubicRel(in float x, in float y, in float x1, in float y1, in float 
x2, in float y2), 

SVGPathSegCurvetoQuadraticAbs createSVGPathSegCurvetoQuadraticAbs(in float x, in float y, in float x1, in float y1), 

SVGPathSegCurvetoQuadraticRel createSVGPathSegCurvetoQuadraticRel(in float x, in float y, in float x1, in float y1), 

SVGPathSegArcAbs createSVGPathSegArcAbs(in float x, in float y, in float r1, in float r2, in float angle, in boolean 
TargeArcFlag, in boolean sveepFlag) 

SVGPathSegArcRel createSVGPathSegArcRel(in float x, in float y, in float r1, in float r2, in float angle, in boolean 
TargeArcFlag, in boolean sveepFlag) 

SVGPathSegLinetoHorizontalAbs createSVGPathSegLinetoHorizontalAbs(in float x), 

SVGPathSegLinetoHorizontalRel createSVGPathSegLinetoHorizontalRel(in float x), 

SVGPathSegLinetoVerticalAbs createSVGPathSegLinetoVerticalAbs(in float y), 

SVGPathSegLinetoVerticalRel createSVGPathSegLinetoVerticalRel(in float y), 

SVGPathSegCurvetoCubicSmoothAbs createSVGPathSegCurvetoCubicSmoothAbs(in float x, in float y, in float x2, in float 
y2): 

SVGPathSegCurvetoCubicSmoothRel createSVGPathSegCurvetoCubicSmoothRel(in float x, in float y, in float x2, in float 
y2), 
SVGPathSegCurvetoQuadraticSmoothAbs createSVGPathSegCurvetoQuadraticSmoothAbs(in float x, in float y), 
SVGPathSegCurvetoQuadraticSmoothRel createSVGPathSegCurvetoQuadraticSmoothRel(in float x, in float y), 
y 





Aftributes: 


e pathLength (readonly SVGAnimatedNumber) 


Corresponds to attribute pathLength on the given “path” element. 
Operations: 


e float getTotalLength() 
Returns the user agent"s computed value for the total length of the path using the user agent"s distance- 


along-a-path algorithm, as a distance in the current user coordinate system. 


Returns 
The total length of the path. 


e SVGPoint getPointAtLength(in float distance) 


Returns the (x,y) coordinate in user space vvhich is disfance units along the path, utilizing the user agentis 
distance-along-a-path algorithm. 


Parameters 


ə float distance 
The distance along the path, relative to the start of the path, as a distance in the current user coordinate 
system. 
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Returns 
The returned point in user space. 


unsigned long getPathSegAtLengthtiin float distance) 


Returns the index into pathSeglist vvhich is disfance units along the path, utilizing the user agent"s distance- 
along-a-path algorithm. 





Parameters 
e float distance 
The distance along the path, relative to the start of the path, as a distance in the current user coordinate 


system. 


Returns 
The index of the path segment, vvhere the first path segment is number 0. 


SVGPathSegClosePath createSVGPathSegClosePath() 


Returns a stand-alone, parentless SVGPathSegClosePath obiect. 


Returns 
A stand-alone, parentless SVGPathSegClosePath obiect. 


SVGPathSegMovetoAbs createSVGPathSegMovetoAbstin float x, in float y) 


Returns a stand-alone, parentless SVGPathSegMovetoAbs obiect. 
Parameters 


ə float x 
The absolute X coordinate for the end point of this path segment. 


e float y 
"The absolute Y coordinate for the end point of this path segment. 


Returns 
A stand-alone, parentless SVGPathSegMovetoAbs obiect. 


ə SVGPathSegMovetoRel createSVGPathSegMovetoRel(in float x, in float y) 
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Returns a stand-alone, parentless SVGPathSegMovetoRel obiect. 
Parameters 


e float x 
"The relative X coordinate for the end point of this path segment. 


e float y 
The relative Y coordinate for the end point of this path segment. 





Returns 
A stand-alone, parentless SVGPathSegMovetoRel obfect. 


e SVGPathSegLinetoAbs createSVGPathSeglLinetoAbsfin float x, in float y) 
Returns a stand-alone, parentless SVGPathSegLinetoAbs obiect. 
Parameters 


e float x 
The absolute X coordinate for the end point of this path segment. 


e float y 
The absolute Y coordinate for the end point of this path segment. 


Returns 
A stand-alone, parentless SVGPathSegLinetoAbs obiect. 


e SVGPathSeglLinetoRel createSVGPathSegLinetoReliin float x, in float y) 
Returns a stand-alone, parentless SVGPathSeglLinetoRel obiect. 
Parameters 


e float x 
"The relative X coordinate for the end point of this path segment. 


e float y 


The relative Y coordinate for the end point of this path segment. 


Returns 
A stand-alone, parentless SVGPathSeglLinetoRel obfect. 
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e SVGPathSegCurvetoCubicAbs createSVGPathSegCurvetoCubicAbsfin float x, in float y, in float x1, in float 
y1, in float x2, in float y2) 


Returns a stand-alone, parentless SVGPathSegCurvetoCubicAbs obiect. 
Parameters 


ə float x 
The absolute X coordinate for the end point of this path segment. 





e float y 
"The absolute Y coordinate for the end point of this path segment. 


ə float x1 
The absolute X coordinate for the first control point. 


ə float y1 
The absolute Y coordinate for the first control point. 


ə float x2 
"The absolute X coordinate for the second control point. 


ə float y2 
"The absolute Y coordinate for the second control point. 


Returns 
A stand-alone, parentless SVGPathSegCurvetoCubicAbs obiect. 


e SVGPathSegCurvetoCubicRel createSVGPathSegCurvetoCubicRel(in float x, in float y, in float x1, in float 
y1, in float x2, in float y2) 


Returns a stand-alone, parentless SVGPathSegCurvetoCubicRel obiect. 
Parameters 


e float x 
"The relative X coordinate for the end point of this path segment. 


e float y 


The relative Y coordinate for the end point of this path segment. 


e float x1 
"The relative X coordinate for the first control point. 
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e float y1 
"The relative Y coordinate for the first control point. 


ə float x2 
The relative X coordinate for the second control point. 


ə float y2 
The relative Y coordinate for the second control point. 





Returns 
A stand-alone, parentless SVGPathSegCurvetoCubicRel obiect. 


ə SVGPathSegCurvetoQuadraticAbs createSVGPathSegCurvetoQuadraticAbstin float x, in float y, in float 
x1, in float y1) 


Returns a stand-alone, parentless SVGPathSegCurvetoQuadraticAbs obiect. 
Parameters 


ə float x 
The absolute X coordinate for the end point of this path segment. 


e float y 
"The absolute Y coordinate for the end point of this path segment. 


ə float x1 
The absolute X coordinate for the first control point. 


e float y1 
"The absolute Y coordinate for the first control point. 


Returns 
A stand-alone, parentless SVGPathSegCurvetoQuadraticAbs obiect. 


ə SVGPathSegCurvetoQuadraticRel createSVGPathSegCurvetoQuadraticRel(in float x, in float y, in float x1, 
in float y1) 


Returns a stand-alone, parentless SVGPathSegCurvetoQuadraticRel obiect. 


Parameters 


e float x 
"The relative X coordinate for the end point of this path segment. 
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e float y 
The relative Y coordinate for the end point of this path segment. 


e float x1 
"The relative X coordinate for the first control point. 


e float y1 
The relative Y coordinate for the first control point. 





Returns 
A stand-alone, parentless SVGPathSegCurvetoQuadraticRel obiect. 


e SVGPathSegArcAbs ereateSVGPathSegArcAbsfin float x, in float y, in float 71, in float r2, in float angle, in 
boolean /largeArcFlag, in boolean sıveepFlag) 


Returns a stand-alone, parentless SVGPathSeg.ArcAbs obiect. 
Parameters 


ə float x 
The absolute X coordinate for the end point of this path segment. 


e float y 
The absolute Y coordinate for the end point of this path segment. 


e float r1 
"The x-axis radius for the ellipse (i.e., r1). 


e float r2 
"The y-axis radius for the ellipse (i.e., T2). 


e float angle 
The rotation angle in degrees for the ellipse"s x-axis relative to the x-axis of the user coordinate system. 


boolean /largeArcFlag 
"The value of the large-arc-flag parameter. 


e boolean sıveepFlag 
"The value of the large-arc-flag parameter. 


Returns 
A stand-alone, parentless SVGPathSegArcAbs obiect. 


e SVGPathSeg.AreRel createSVGPathSegAreRelfin float x, in float y, in float r1, in float 72, in float angle, in 
boolean largeArcFlag, in boolean sıveepFlag) 
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Returns a stand-alone, parentless SVGPathSegAreRel obiect. 
Parameters 


e float x 
"The relative X coordinate for the end point of this path segment. 





e float y 
The relative Y coordinate for the end point of this path segment. 


ə float r1 
The x-axis radius for the ellipse (i.e., r1). 


e float r2 
"The y-axis radius for the ellipse (i.e., T2). 


e float angle 
The rotation angle in degrees for the ellipse"s x-axis relative to the x-axis of the user coordinate system. 


boolean /largeArcFlag 
The value of the large-arc-flag parameter. 


e boolean sıveepFlag 
The value of the large-arc-flag parameter. 


Returns 
A stand-alone, parentless SVGPathSeg.AreRel obiect. 


e SVGPathSegLinetoHorizontalAbs createSVGPathSegLinetoHorizontalA bstin float x) 
Returns a stand-alone, parentless SVGPathSegLinetoHorizontalAbs obiect. 
Parameters 


e float x 
"The absolute X coordinate for the end point of this path segment. 


Returns 
A stand-alone, parentless SVGPathSegLinetoHorizontalAbs obiect. 


e SVGPathSegLinetoHorizontalRel createsVGPathSegLinetoHorizontalRel(in float x) 
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Returns a stand-alone, parentless SVGPathSegLinetoHorizontalRel obiect. 
Parameters 


e float x 
"The relative X coordinate for the end point of this path segment. 


Returns 
A stand-alone, parentless SVGPathSegLinetoHorizontalRel obiect. 





SVGPathSeglLinetoVerticalAbs createSVGPathSegLinetoVerticalAbstin float y) 


Returns a stand-alone, parentless SVGPathSeglLinetoVerticalAbs obiect. 
Parameters 


e float y 
"The absolute Y coordinate for the end point of this path segment. 


Returns 
A stand-alone, parentless SVGPathSegLinetoVerticalAbs obiect. 


SVGPathSeglLinetoVerticalRel createSVGPathSegLinetoVerticalRel(in float y) 


Returns a stand-alone, parentless SVGPathSeglLinetoVerticalRel obfect. 
Parameters 


e float y 
"The relative Y coordinate for the end point of this path segment. 


Returns 
A stand-alone, parentless SVGPathSegLinetoVerticalRel obfect. 


SVGPathSegCurvetoCubicSmoothAbs createSVGPathSegCurvetoCubicSmoothAbsfin float x, in float y, in 
float x2, in float y2) 


Returns a stand-alone, parentless SVGPathSegCurvetoCubicSmoothAbs obiect. 


Parameters 


ə float x 
The absolute X coordinate for the end point of this path segment. 
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e float y 
The absolute Y coordinate for the end point of this path segment. 


ə float x2 
"The absolute X coordinate for the second control point. 


ə float y2 
The absolute Y coordinate for the second control point. 





Returns 
A stand-alone, parentless SVGPathSegCurvetoCubicSmoothAbs obiect. 


e SVGPathSegCurvetoCubicSmoothRel ereateSVGPathSegCurvetoCubicSmoothReliin float x, in float y, in 
float x2, in float y2) 


Returns a stand-alone, parentless SVGPathSegCurvetoCubicSmoothRel obiect. 
Parameters 


e float x 
"The relative X coordinate for the end point of this path segment. 


e float y 
"The relative Y coordinate for the end point of this path segment. 


e float x2 
"The relative X coordinate for the second control point. 


ə float y2 
The relative Y coordinate for the second control point. 


Returns 
A stand-alone, parentless SVGPathSegCurvetoCubicSmoothRel obiect. 


e SVGPathSegCurvetoQuadraticSmoothAbs createSVGPathSegCurvetoQuadraticSmoothAbstin float x, in 
float y) 


Returns a stand-alone, parentless SVGPathSegCurvetoQuadraticSmoothAbs obiect. 


Parameters 


ə float x 
The absolute X coordinate for the end point of this path segment. 
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e float y 
The absolute Y coordinate for the end point of this path segment. 


Returns 
A stand-alone, parentless SVGPathSegCurvetoQuadraticSmoothAbs obiect. 


e SVGPathSegCurvetoQuadraticSmoothRel ecreateSVGPathSegCurvetoQuadraticSmoothRel(in float x, in 
float y) 





Returns a stand-alone, parentless SVGPathSegCurvetoQuadraticSmoothRel obiect. 
Parameters 


e float x 
"The relative X coordinate for the end point of this path segment. 


e float y 
"The relative Y coordinate for the end point of this path segment. 


Returns 
A stand-alone, parentless SVGPathSegCurvetoQuadraticSmoothRel obiect. 


0 Basic Shapes 


Contents 
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9.1 İntroduction 

9.2 The “rect” element 

9.3 The “circle” element 
9.4 The “ellipse” element 
9.5 The “line” element 

9.6 The “polyline” element 
9.7 The “polygon” element 





9.7.1 The grammar for points specifications in “polyline” and "polygon” elements 
9.8 DOM interfaces 

9.8.1 Interface SVGRectElement 

9.8.2 Interface SVGCircleElement 

9.8.3 Interface SVGEllipseElement 

9.8.4 Interface SVGLineElement 

9.8.5 Interface SVGAnimatedPoints 

9.8.6 Interface SVGPolylineElement 

9.8.7 Interface SVGPolygonElement 


9.1 Introduction 


SVG contains the follovving set of basic shape elements: 


ə rectangles (including optional rounded corners), created vvith the “rect” element, 
e circles, created vvith the “circle” element, 

e ellipses, created vvith the “ellipse” element, 

e straight lines, created vvith the “line” element, 

e polylines, created vvith the “polyline” element, and 

e polygons, created vvith the “polygon” element. 


Mathematically, these shape elements are equivalent to a “path” element that vvould construct the same shape. The 
basic shapes may be stroked, filled and used as clip paths. AİI of the properties available for “path” elements also 
apply to the basic shapes. 


9.2 The rect” element 


"The “rect” element defines a rectangle vvhich is axis-aligned vvith the current user coordinate system. Rounded rect- 


angles can be achieved by setting appropriate values for attributes “rx” and “ry”. 
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Categories: rect 
Basic shape element, graphics element, shape element 


, 


Content model: 
Any number of the follovving elements, in any order: 
animation elements 
descriptive elements 





Attributes: 
conditional processing attributes 
core attributes 
graphical event attributes 
presentation attributes 
“class” 
“style” 
“externalResourcesRequired” 


“transform” 


çiləsi 


DOM Tnterfaces: 
SVGRectElement 


Attribute definitions: 


x — "-coordinates-" 
"The x-axis coordinate of the side of the rectangle vvhich has the smaller x-axis coordinate value in the current 


user coordinate system. 
If the attribute is not specifted, the effect is as if a value of "0" vvere specifted. 
Animatable: yes. 


y — "-coordinates-" 
"The y-axis coordinate of the side of the rectangle vvhich has the smaller y-axis coordinate value in the current 


user coordinate system. 
If the attribute is not specifted, the effect is as if a value of "0" vvere specifted. 
Animatable: yes. 


vidth - "-length-" 
"The vvidth of the rectangle. 
A negative value is an error (see Error processing). A value of zero disables rendering of the element. 
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Animatable: yes. 


height — "-length-" 
"The height of the rectangle. 
A negative value is an error (see Error processing). A value of zero disables rendering of the element. 
Animatable: yes. 





rx — "-length-" 
For rounded rectangles, the x-axis radius of the ellipse used to round off the corners of the rectangle. 
A negative value is an error (see Error processing). 
See the notes belovv about vvhat happens if the attribute is not specifted. 
Animatable: yes. 


ry — "-length”" 
For rounded rectangles, the y-axis radius of the ellipse used to round off the corners of the rectangle. 
A negative value is an error (see Error processing). 
See the notes belovv about vvhat happens if the attribute is not specifted. 
Animatable: yes. 


"The values used for the x- and y-axis rounded corner radii are determined implicitly if the “rx” or “ry” attributes 
(or both) are not specifted, or are specifted but vvith invalid values. The values are also subfect to clamping so that 
the lengths of the straight segments of the rectangle are never negative. The effective values for “rx” and “ry” are 
determined by follovving these steps in order: 


Let rx and ry be length values. 
If neither “rx” nor “ry” are properly specifted, then set both rx and ry to 0. (Ihis vvill result in square corners.) 
Othervvise, if a properly specifted value is provided for “rx”, but not for “ry”, then set both rx and ry to the 
value of “rx”. 

4. Othervvise, if a properly specifted value is provided for “ry”, but not for “rx”, then set both rx and ry to the 

value of “ry”. 

Othervvise, both “rx” and “ry” vvere specifted properly. Set rx to the value of “rx” and ry to the value of “ry”. 

If rx is greater than half of “vidih”, then set rx to half of “vridth”. 

If ry is greater than half of “height”, then set ry to half of “height”. 

The effective values of “rx” and “ry” are rx and ry, respectively. 


R 


Mathematically, a “rect” element can be mapped to an equivalent “path” element as follovvs: (Note: all coordinate 


and length values are first converted into user space coordinates according to Units.) 


e perform an absolute moveto operation to İocation (x--rx,y), vvhere x is the value of the “rect” elements “x” at- 
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tribute converted to user space, rx is the effective value of the “rx” attribute converted to user space and y is 
the value of the “y” attribute converted to user space 

e perform an absolute horizontal lineto operation to location (x--vvidfh-rx,y), vvhere vvidth is the “rect” elements 
“vridth” attribute converted to user space 

e perform an absolute elliptical arc operation to coordinate (xevvidth,y-ry), vvhere the effective values for the 
“rx” and “ry” attributes on the “rect” element converted to user space are used as the rx and ry attributes on the 
elliptical arc command, respectively, the x-axis-rofafion is set to zero, the /arge-arc-flag is set to zero, and the 
svveep-flag is set to one 

e perform a absolute vertical /inefo to location (xeəvidih,yi-height-ry), vrhere height is the “rect” elements 





“height” attribute converted to user space 
e perform an absolute elliptical arc operation to coordinate (x-vvidfh-rx,y-height) 
e perform an absolute horizontal /inefo to location (x-rx,y- height) 
e perform an absolute elliptical arc operation to coordinate (x,y-height-ry) 
e perform an absolute absolute vertical /inefo to location (x,y-ry) 
e perform an absolute elliptical arc operation to coordinate (x-rx,y) 


Example rect01 shovvs a rectangle vvith sharp corners. The “rect” element is filled vvith yellovv and stroked vvith 
navy. 


c?xml versionz"1.0" standalone-"no"?z 
€ DOCTYPE svg PUBLİC "-//V3C//DTD SVG 1.1//EN" 
"http: / /vuv/ .vV3.0Tg/Graphics/SVG/1.1/DTD/svg11.dtd"z 
€svg vidthe"12cm" height-"4cm" vievBoxz"0 0 1200 400" 
xmlnse"http: / /vvv .vV3.o0rg/2000/svg" versionze"1.1"5 
edescsExample rect01 - rectangle vith sharp corners-/desc” 


c1-- Shov outline of canvas using "rect" element --x 
crect xe"1" ye-"1" vidth-"1198" height-"398" 
fill-"none" strokeze"blue" stroke-vidth-"2"/5 


crect x-"400" y-"100" vidth-"400" height-"200" 


fill-"yellov" strokez"navy" stroke-vidthe"10" /s 
s/ svg” 


Example rect01 














Example rect02 shovvs tvvo rounded rectangles. The “rx” specifies hovv to round the corners of the rectangles. Note 
that since no value has been specifted for the “ry” attribute, it vvill be assigned the same value as the “rx” attribute. 


c?xml versionz"1.0" standalone-"no"?z 
€ DOCTYPE svg PUBLİC "-//V3C//DTD SVG 1.1//EN" 
"http: / /vvuv/.v/3..org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
s€svg vidth-"12cm" height-"4cm" vievBoxz"0 0 1200 400" 
xmlnsze"http: / /vuv/ .vV3.0T9/2000/svg" versionz"1.1"5 
cdescsExample rect02 - rounded rectangles-/desc- 
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c1-- Shov outline of canvas using "rect" element --x 
crect xe"1" y-"1" vidth-"1198" height-"398" 
fill-"none" strokez"blue" stroke-vidth-"2"/5 


crect x-"100" y-"100" vidth-"400" height-"200" rx-"50" 
fill-"green" /5 


sg transform-"translate(700 210) rotate(-30)"5 
xvrect xe"0" yz"0" vidth-"400" height-"200" rxe"50" 
fill-"none" strokeze"purple" stroke-vidth-"30" /s 
x/g” 
s/ svg” 





Example rect02 











9.3 The “circle” element 


The “circle” element defines a circle based on a center point and a radius. 


Categories: “circle” 
Basic shape element, graphics element, shape element 


Content model: 
Any number of the follovving elements, in any order: 
animation elements 
descriptive elements 


Attributes: 
conditional processing attributes 
core attributes 
graphical event attributes 
presentation attributes 


“class” 
“style” 
“externalResourcesRequired” 


“transform” 
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DOM Tnterfaces: 
SVGCircleElement 


Attribute definitions: 





cx — "-coordinates-" 
"The x-axis coordinate of the center of the circle. 
If the attribute is not specifted, the effect is as if a value of "0" vvere specifted. 
Animatable: yes. 


cy — "-coordinates" 
"The y-axis coordinate of the center of the circle. 
If the attribute is not specifted, the effect is as if a value of "0" vvere specifted. 
Animatable: yes. 


r — "-lengths" 
"The radius of the circle. 
A negative value is an error (see Error processing). A value of zero disables rendering of the element. 
Animatable: yes. 


"The arc of a “circle” element begins at the "3 o"clock" point on the radius and progresses tovvards the "9 o"clock" 
point. The starting point and direction of the arc are affected by the user space transform in the same manner as 
the geometry of the element. 

Example circle01 consists of a “circle” element that is filled vvith red and stroked vvith blue. 


c?xml versionz"1.0" standalonez"no"?z 
x DOCTYPE svg PUBLİC "-//V/3C/ /DTD SVG 1.1//EN" 
"http: / /vuv .v3.org/Graphics/SVG/1.1/DTD/svg11.dtd"x 
s€svg vidth-"12cm" height-"4cm" vievBoxz"0 0 1200 400" 
xmlnse"http: / /uvv .vV3.o0rg/2000/svg" versionze"1.1"5 
cdescsExample circle01 - circle filled vith red and stroked vith bluec/desc- 


c1-- Shov outline of canvas using "rect" element --5 
crect xe"1" y-"1" vidth-"1198" height-"398" 
fill-"none" stroke-"blue" stroke-vidth-"2"/5 


ccircle cxz"600" cyz"200" r-"100" 
fill-"red" strokeze"blue" stroke-vidth-"10" /z 
x/ svg” 


Example circle01 
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9.4 The “ellipse” element 





"The “ellipse” element defines an ellipse vvhich is axis-aligned vvith the current user coordinate system based on a 


center point and tvvo radii. 


Categories: “ellipse” 
Basic shape element, graphics element, shape element 


Content model: 
Any number of the follovving elements, in any order: 
animation elements 
descriptive elements 


Attributes: 
conditional processing attributes 
core attributes 
graphical event attributes 
presentation attributes 
“class” 
“style” 
“externalResourcesRequired” 


“transform” 


DOM TInterfaces: 
SVGEllipseElement 


Attribute definitions: 


cx € "-coordinate”" 
"The x-axis coordinate of the center of the ellipse. 
If the attribute is not specifted, the effect is as if a value of "0" vvere specifted. 
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Animatable: yes. 


cy — "-coordinates" 
"The y-axis coordinate of the center of the ellipse. 
If the attribute is not specifted, the effect is as if a value of "0" vvere specifled. 
Animatable: yes. 


rx — "-length-" 





The x-axis radius of the ellipse. 
A negative value is an error (see Error processing). A value of zero disables rendering of the element. 
Animatable: yes. 


ry — "-length-" 
The y-axis radius of the ellipse. 
A negative value is an error (see Error processing). A value of zero disables rendering of the element. 
Animatable: yes. 


The arc of an “ellipse” element begins at the "3 o"clock" point on the radius and progresses tovvards the "9 o"clock" 
point. The starting point and direction of the arc are affected by the user space transform in the same manner as 
the geometry of the element. 

Example ellipse01 belovv speciftes the coordinates of the tvvo ellipses in the user coordinate system established 
by the “vievvBox” attribute on the “svg/ element and the “transform” attribute on the “g” and “ellipse” elements. Both 
ellipses use the default values of zero for the “ex” and “ey” attributes (the center of the ellipse). The second ellipse is 
rotated. 


c?xml versionz"1.0" standalone-"no"?z 
€ DOCTYPE svg PUBLİC "-//V3C//DTD SVG 1.1//EN" 
"http: / /vuv .v3..org/Graphics/SVG/1.1/DTD/svg11.dtd"x 
s€svg vidth-"12cm" height-"4cm" vievBoxz"0 0 1200 400" 
xmlnsz"http: / /vuv/ .vV3.0T9/2000/svg" versionz"1.1"5 
cdescsExample ellipse01 - examples of ellipses-c/desc- 


c1-- Shov outline of canvas using "rect" element --5 
crect xe"1" y-"1" vidth-"1198" height-"398" 
fill-"none" stroke-"blue" stroke-vidthe"2" /s 


sg transform-"translate(300 200)"5 
cellipse rxz"250" ryz"100" 
fill-"red" /s 
x/g” 
cellipse transform-"translate(900 200) rotate(-30)" 
rxz"250" ry-"100" 
fill-"none" strokez"blue" stroke-vidth-"20" /s 


x/svg” 
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Example ellipse01 











0.5 The “ne” element 


The “line” element defines a line segment that starts at one point and ends at another. 


Categories: 
Basic shape element, graphics element, shape element 


Content model: 
Any number of the follovving elements, in any order: 
animation elements 
descriptive elements 


Attributes: 
conditional processing attributes 
core attributes 
graphical event attributes 
presentation attributes 
“class” 
“style” 
“externalResourcesRequired” 


“transform” 


DOM Interfaces: 
SVGLineElement 





“line” 
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Attribute definitions: 


x1 — "-coordinate-" 
"The x-axis coordinate of the start of the line. 
If the attribute is not specifted, the effect is as if a value of "0" vvere specifted. 
Animatable: yes. 


y1 — "-coordinates”" 
"The y-axis coordinate of the start of the line. 
If the attribute is not specifted, the effect is as if a value of "0" vvere specifted. 
Animatable: yes. 


x2 — "-coordinate-" 
"The x-axis coordinate of the end of the line. 
If the attribute is not specifted, the effect is as if a value of "0" vvere specifted. 
Animatable: yes. 


y2 — "-coordinates" 
"The y-axis coordinate of the end of the line. 
If the attribute is not specifted, the effect is as if a value of "0" vvere specifted. 
Animatable: yes. 


Mathematically, a “line” element can be mapped to an equivalent “path” element as follovvs: (Note: all coordinate 
and length values are first converted into user space coordinates according to Units.) 


e perform an absolute moveto operation to absolute location (x1,y1), vrhere x1 and y1 are the values of the “line” 
elements “xT” and “yr” attributes converted to user space, respectively 

e perform an absolute lineto operation to absolute location (x2,y2), vvhere x2 and y2 are the values of the “line” 
elements “x?” and “yz” attributes converted to user space, respectively 


Because “line” elements are single lines and thus are geometrically one-dimensional, they have no interior, thus, 
“line” elements are never filled (see the “fil” property). 

Example line01 belovv specifies the coordinates of the five lines in the user coordinate system established by 
the “vievvBox” attribute on the “svg” element. The lines have different thicknesses. 


c?xml versionz"1.0" standalonez"no"?z 
€ DOCTYPE svg PUBLİC "-//V3C//DTD SVG 1.1//EN" 
"http: / /vvv/.vV3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
s€svg vidth-"12cm" height-"4cm" vievBoxz"0 0 1200 400" 
xmlnsze"http: / /vuv/ .vV3.0T9/2000/svg" versionz"1.1"2 
edescsExample line01 - lines expressed in user coordinates-/desc” 


c1-- Shov outline of canvas using "rect" element --x 
crect xe"1" y-"1" vidth-"1198" height-"398" 
fill-"none" strokez"blue" stroke-vidthe"2" /s 


s€g strokez"green" 5 
eline x1-"100" yı-"300" x2-"300" y2-"100" 
stroke-vidth-"5" /s 
eline x1-"300" yl-"300" x2-"500" y2-"100" 


stroke-vidth-"10" /s 
eline x1z"500" y1-"300" x2-"700" y2-"100" 
stroke-vidth-"15" /s 
eline x1-"700" y1-"300" x2-"900" y2-"100" 
stroke-vidth-"20" /s 
eline x1-"900" y1-"300" x2-"1100" y2-"100" 
stroke-vidth-"25" /s 
x/g” 
s/ svg” 
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Example line01 


/”Z/Z/ZZ 


9.6 The “polyline” element 











The “polyline” element defines a set of connected straight line segments. Typically, “polyline” elements define open 
shapes. 


Categories: “polyline” 
Basic shape element, graphics element, shape element 


Content model: 
Any number of the follovving elements, in any order: 
animation elements 
descriptive elements 


Attributes: 
conditional processing attributes 
core attributes 
graphical event attributes 
presentation attributes 
“class” 
“style” 
“externalResourcesRequired” 
“transform” 


“points” 


DOM Tnterfaces: 
SVGPolylineElement 


Attribute definitions: 


points — "-list-of-points”" 
"The points that make up the polyline. AlI coordinate values are in the user coordinate system. 
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Animatable: yes. 


If an odd number of coordinates is provided, then the element is in error, vvith the same user agent behavior as 
occurs vvith an incorrectly specifted “path” element. 
Mathematically, a “polyline” element can be mapped to an equivalent “path” element as follovvs: 


e perform an absolute moveto operation to the first coordinate pair in the list of points 
e for each subsequent coordinate pair, perform an absolute lineto operation to that coordinate pair. 





Example polyline01 belovr speciftes a polyline in the user coordinate system established by the “vievvBox” attribute 


on the “svg” element. 


c?xml versionz"1.0" standalone-"no"?z 
€ DOCTYPE svg PUBLİC "-//V3C//DTD SVG 1.1//EN" 
"http: / /Muv .v3..org/Graphics/SVG/1.1/DTD/svg11.dtd"x 
s€svg vidth-"12cm" height-"4cm" vievBoxz"0 0 1200 400" 
xmlnse"http: / /vvv .vV3.0rg/2000/svg" versionze"1.1"5 
edescsExample polyline601 - increasingly larger bars-/desc” 


x€1-- Shov outline of canvas using "rect" element --5 
crect xe"1" y-"1" vidth-"1198" height-"398" 
fill-"none" stroke-"blue" stroke-vidthe"2" /s 


epolyline fill-"none" strokez"blue" stroke-vidth-"10" 
pointse"50,375 
150,375 150,325 250,325 250,375 
350,375 350, 250 450, 250 450,375 
550,375 550, 175 650, 175 650,375 
750,375 750, 100 850, 100 850,375 
950,375 950, 25 1050, 25 1050,375 
1150, 375" /s 
s/ svg” 


Example polyline01 














9.7 The “polygon” element 


The “polygon” element defines a closed shape consisting of a set of connected straight line segments. 
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Categories: “polygon” 
Basic shape element, graphics element, shape element 


Content model: 
Any number of the follovving elements, in any order: 
animation elements 
descriptive elements 


Attributes: 
conditional processing attributes 
core attributes 
graphical event attributes 
presentation attributes 
“class” 
“style” 
“externalResourcesRequired” 
“transform” 


“points” 


DOM TInterfaces: 
SVGPolygonElement 


Attribute definitions: 


points — "-list-of-points”" 
"The points that make up the polygon. All coordinate values are in the user coordinate system. 
Animatable: yes. 


If an odd number of coordinates is provided, then the element is in error, vvith the same user agent behavior as 
occurs vvith an incorrectly specifted “path” element. 
Mathematically, a “polygon” element can be mapped to an equivalent “path” element as follovvs: 


e perform an absolute moveto operation to the first coordinate pair in the list of points 
e for each subsequent coordinate pair, perform an absolute lineto operation to that coordinate pair 
e perform a closepath command 


Example polygon61 belovv speciftes tvvo polygons (a star and a hexagon) in the user coordinate system established 
by the “vievrBox” attribute on the “svg” element. 


c?xml versionz"1.0" standalone-"no"?5 
€ DOCTYPE svg PUBLİC "-//V3C//DTD SVG 1.1//EN" 
"http: / /vvv/.v/3.org/Graphics/SVG/1.1/DTD/svg11.dtd"s 
s€svg vidth-"12cm" height-"4cm" vievBoxz"0 0 1200 400" 
xmlnsz"http: / /vuv/ .vV3.0T9/2000/svg" versionz"1.1"5 
edescsExample polygon01 - star and hexagon-/desc” 


xc1-- Shov outline of canvas using "rect" element --5 


crect xe"1" y-"1" vidth-"1198" height-"398" 
fill-"none" strokez"blue" stroke-vidthe"2" /s 


epolygon fille"red" strokeze"blue" stroke-vidthe"10" 
pointse"350,75 379,161 469,161 397,215 
423,301 350,250 277,301 303,215 
231,161 321,161" /” 
cpolygon fille"lime" strokee"blue" stroke-vidth-"10" 
pointse"850,75 958,137.5 958,262.5 
850,325 742,262.6 742,137.5" /” 
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c/ svg” 


Example polygon01 














9.7.1 The grammar for points specifications in “polyline” and “polygon” elements 


"The follovving is the Extended Backus-Naur Form (EBNF) for points specifications in “polyline” and “polygon” ele- 
ments. The follovving notation is used: 


ə “:0 or more 

ə 1 :0T more 

e 7:00r1 

e (): grouping 

e İ: separates alternatives 

e double quotes surround literals 


list-of-points: 

vsp” coordinate-pairs? vsp” 
coordinate-pairs: 

coordinate-pair 

İ coordinate-pair comma-vsp coordinate-pairs 
coordinate-pair: 

coordinate comma-vsp coordinate 

İ coordinate negative-coordinate 
coordinate: 

number 
number: 

sign? integer-constant 

İ sign? floating-point-constant 
negative-coordinate: 

"-" integer-constant 

Iİ "-" floating-point-constant 
comma -v/sp: 


(u/Sp- comma? vsp”) 1 (comma vsp”) 
comma : 
integer-constant: 

digit-sequence 
floating-point-constant: 

Tractional-constant exponent? 

İ digit-sequence exponent 
Tfractional-constant: 
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digit-sequence? "." digit-sequence 
İ digit-sequence "." 
exponent: 
( "e" / "E" ) sign? digit-sequence 
sign: 
uu İ " — " 
digit-sequence: 
digit 
İ digit digit-sequence 
digit: 
"0" İ "" l nom İ "3" l udu l up İ "6" l uza İ "." l "g" 


vsp: 
(4x20 1 4x9 1 “xD İ £xA)4 


9.8 DOM interfaces 


9.8.1 Interface SVGRectElement 


The SVGRectElement interface corresponds to the “rect” element. 


interface SV6RectElement : SVGElement, 
SVGTests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVöStylable, 
SVGTransformable 1 
readonly attribute SVGAnimatedLength x, 
readonly attribute SVGAnimatedLength y, 
readonly attribute SVGAnimatedLength vidth, 
readonly attribute SVGAnimatedLength height, 
readonly attribute SVGAnimatedLength rx, 
readonly attribute SVGAnimatedLength ry, 
y 


Attributes: 
e X (readonly SVGAnimatedLength) 


Corresponds to attribute “x” on the given “rect” element. 


ey (readonly SVGAnimatedLength) 


Corresponds to attribute “y” on the given “rect” element. 


e vvidth (readonly SVGAnimatedLength) 


Corresponds to attribute “vvidih” on the given “rect” element. 
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e height (readonly SVGAnimatedLength) 


Corresponds to attribute “height” on the given “rect” element. 


rx (readonly SVGAnimatedlLength) 


Corresponds to attribute “rx” on the given “rect” element. 


ry (readonly SVGAnimatedLength) 





Corresponds to attribute “ry” on the given “rect” element. 


9.8.2 Interface SVGCircleElement 


The SVGCircleElement interface corresponds to the “circle” element. 


interface SV6CircleElement : SVGElement, 

SV6Tests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVöStylable, 
SVGTransformable 1 

readonly attribute SVGAnimatedLength cx, 

readonly attribute SVGAnimatedLength cy, 

readonly attribute SVGAnimatedLength r, 


Attributes: 
e cx (readonly SVGAnimatedLength) 


Corresponds to attribute “ex” on the given “circle” element. 


e cy (readonly SVGAnimatedLength) 


Corresponds to attribute “ey” on the given “circle” element. 


e r (readonly SVGAnimatedLength) 


Corresponds to attribute “r” on the given “circle” element. 


9.8.3 Interface SVGEllipseElement 


The SVGEllipseElement interface corresponds to the “ellipse” element. 


interface SVGEllipseElement : SVGElement, 
SV6GTests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVGStylable, 
SVGTransformable 1 
readonly attribute SVGAnimatedLength cx, 
readonly attribute SVGAnimatedLength cy, 
readonly attribute SVGAnimatedLength rx, 
readonly attribute SVGAnimatedLength ry, 
R 
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Attributes: 





e cx (readonly SVGAnimatedLength) 


Corresponds to attribute “ex” on the given “ellipse” element. 


e cy (readonly SVGAnimatedLength) 


Corresponds to attribute “ey” on the given “ellipse” element. 


e rX (readonly SVGAnimatedLength) 


Corresponds to attribute “rx” on the given “ellipse” element. 


e Ty (readonly SVGAnimatedLength) 


Corresponds to attribute “ry” on the given “ellipse” element. 


9.8.4 Interface SVGLineElement 


The SVGLineElement interface corresponds to the “line” element. 


interface SV6GLineElement : SVGElement, 
SVGTests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVGStylable, 
SVGTransformable 1 
readonly attribute SVGAnimatedLength x1, 
readonly attribute SVGAnimatedLength y1, 
readonly attribute SVGAnimatedLength x2, 
readonly attribute SVGAnimatedLength y2, 
IR 


Aftributes: 


e X1 (readonly SVGAnimatedLength) 


Corresponds to attribute “x1” on the given “line” element. 
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e y1 (readonly SVGAnimatedLength) 


Corresponds to attribute “y1” on the given “line” element. 


e X2 (readonly SVGAnimatedLength) 


Corresponds to attribute “x2” on the given “line” element. 





e y2 (readonly SVGAnimatedLength) 


Corresponds to attribute “y2” on the given “line” element. 


9.8.5 Interface SVGAnimatedPoints 


The SVGAnimatedPoeints interface supports elements vvhich have a "points” attribute vvhich holds a list of coordin- 
ate values and vvhich support the ability to animate that attribute. 
Additionally, the “pointis” attribute on the original element accessed via the XML DOM f(e.g., using the getAt- 
tribute() method call) vvill reflect any changes made to points. 
interface SVGAnimatedPoints (1 
readonly attribute SV6GPointList points, 


readonly attribute SVGPointList animatedPoints, 
i 


Attributes: 


e points (readonly SVGPointlist) 


Provides access to the base (i.e., static) contents of the “poinis” attribute. 


e animatedPoints (readonly SVGPointlist) 


Provides access to the current animated contents of the “poinis” attribute. If the given attribute or property 
is being animated, contains the current animated value of the attribute or property. If the given attribute or 
property is not currently being animated, contains the same value as points. 


9.8.6 Interface SVGPolylineElement 


The SVGPolylineElement interface corresponds to the “polyline” element. 


interface SV6PolylineElement : SVGElement, 
SV6GTests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVGStylable, 
SVGTransformable, 
SVGAnimatedPoints if 
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9.8.7 Interface SVGPolygonElement 


The SVGPolygonElement interface corresponds to the “polygon” element. 





interface SVU6PolygonElement : SVGElement, 
SVGTests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVöStylable, 
SVGTransformable, 
SVGAnimatedPoints (f 

x 


10 Text 


Contents 
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10.1 Introduction 
10.2 Characters and their corresponding glyphs 
10.3 Fonts, font tables and baselines 
10.4 The “text” element 
10.5 The “tspan” element 
10.6 The “tref” element 
10.7 Text layout 
10.7.1 Text layout introduction 
10.7.2 Setting the inline-progression-direction 





10.7.3 Giİyph orientation vvithin a text run 
10.7.4 Relationship vvith bidirectionality 
10.8 Text rendering order 
10.9 Alignment properties 
10.9.1 Text alignment properties 
10.9.2 Baseline alignment properties 
10.10 Font selection properties 
10.11 Spacing properties 
10.12 Text decoration 
10.13 Text on a path 
10.13.1 Introduction to text on a path 
10.13.2 The “textPath” element 
10.13.3 Text on a path layout rules 
10.14 Alternate giyphs 
10.14.1 The “altGlyph” element 
10.14.2 The “altGiyphDef”, “altGlyphltem” and “giyphRef” elements 
10.15 VVhite space handling 
10.16 Text selection and clipboard operations 
10.17 DOM interfaces 
10.17.1 Interface SVGTextContentElement 
10.17.2 Interface SVGTextPositioningElement 
10.17.3 Imterface SVGTextElement 
10.17.4 İnterface SVGTSpanElement 
10.17.5 Interface SVGTRefElement 
10.17.6 İnterface SVGTextPathElement 
10.17.7 Interface SVGAltGiyphElement 
10.17.8 İnterface SVGAltGiyphDefElement 
10.17.9 Interface SVGAltGiyphltemElement 


c 
.o 
5 
İv) 
m") 
(s 
(3) 
c 
E 
ə) 
(ə) 
o 
ad 
. 
s 





10.17.10 Interface SVGGlyphRefElement 


10.1 İntroduction 


Text that is to be rendered as part of an SVG document fragment is specifted using the “text” element. The charac- 
ters to be dravvn are expressed as XML character data (PXML10), section 2.4) inside the “text” element. 

SVG/s “text” elements are rendered like other graphics elements. Thus, coordinate system transformations, 
painting, clipping and masking features apply to “text” elements in the same vvay as they apply to shapes such as 
paths and rectangles. 

Each “text” element causes a single string of text to be rendered. SVG performs no automatic line breaking or 
vvord vvrapping. To achieve the effect of multiple lines of text, use one of the follovving methods: 


e "The author or authoring package needs to pre-compute the line breaks and use mulltiple “text” elements (one 
for each line of text). 

e "Ihe author or authoring package needs to pre-compute the line breaks and use a single “text” element vvith 
one or more “tspan” child elements vvith appropriate values for attributes “x”, “y”, “dx” and “dy” to set nevv start 
positions for those characters vvhich start nevv lines. (This approach allovvs user text selection across multiple 
lines of text -- see Text selection and clipboard operations.) 

ə Express the text to be rendered in another XML namespace such as XHTML (XHTML) embedded inline 
vvithin a “foreignObiect” element. (Note: the exact semantics of this approach are not completely defined at 


this time.) 


"The text strings vvithin “text” elements can be rendered in a straight line or rendered along the outline of a “path” 
element. SVG supports the follovving international text processing features for both straight line text and text on a 


path: 


e horizontal and vertical orientation of text 

ə İeft-to-right or bidirectional text (i.e., languages vvhich intermix right-to-left and left-to-right text, such as Ar- 
abic and Hebrevv) 

e vvhen SVG fonts are used, automatic selection of the correct glyph corresponding to the current form for Ar- 
abic and Han text 


(Ihe layout rules for straight line text are described in Text layout. The layout rules for text on a path are described 
in Text on a path layout rules.) 
Because SVG text is packaged as XML character data: 


e Text data in SVG content is readily accessible to the visually impaired (see Accessibility Support) 

e İn many vievving scenarios, the user vvill be able to search for and select text strings and copy selected text 
strings to the system clipboard (see Text selection and clipboard operations) 

ə. XML-compatible VVeb search engines vvill find text strings in SVG content vvith no additional effort over vvhat 
they need to do to find text strings in other XML documents 
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Multi-language SVG content is possible by substituting different text strings based on the users preferred lan- 
guage. 

For accessibility reasons, it is recommended that text vvhich is included in a document have appropriate se- 
mantic markup to indicate its function. See SVG accessibility guidelines for more information. 


10.2 Characters and their corresponding giyphs 


m XML İXML10), textual content is defined in terms of a sequence of XML characters, vvhere each character is 
defined by a particular Unicode code point TUNICODEİ. Fonts, on the other hand, consist of a collection of gİyphs 
and other associated information, such as font tables. A gİyph is a presentable form of one or more characters (or 
a part of a character in some cases). Each glyph consists of some sort of identifter (in some cases a string, in other 
cases a number) along vvith dravving instructions for rendering that particular glyph. 

In many cases, there is a one-to-one mapping of Unicode characters (i.e., Unicode code points) to glyphs in a 
font. For example, it is common for a font designed for Latin languages (vvhere the term Lafir is used for European 
languages such as English vvith alphabets similar to and/or derivative to the Latin language) to contain a single 
giyph for each of the standard ASCII characters (i.e., A-to-Z, a-to-z, 0-to-9, plus the various punctuation characters 
found in ASCIBD, Thus, in most situations, the string "XML", vvhich consists of three Unicode characters, vvould be 
rendered by the three glyphs corresponding to "X", "M" and "L", respectively. 

In various other cases, hovvever, there is not a strict one-to-one mapping of Unicode characters to glyphs. 
Some of the circumstances vvhen the mapping is not one-to-one: 


e Ligatures - For best looking typesetting, it is often desirable that particular sequences of characters are 
rendered as a single glyph. An example is the vvord "office", Many fonts vvill define an "fE" ligature. V/hen 
the vvord "office" is rendered, sometimes the user agent vvill render the giyph for the "İB" ligature instead of 
rendering distinct gİyphs (1e., "f", "f" and "i") for each of the three characters. Thus, for ligatures, multiple 
Unicode characters map to a single glyph. (Note that for proper rendering of some languages, ligatures are 
required for certain character combinations.) 

e Composite characters - In various situations, commonly used adornments such as diacritical marks vvill be 
stored once in a font as a particular gİyph and then composed vvith one or more other glyphs to result in the 
desired character. For example, it is possible that a font engine might render the € character by first rendering 
the giyph for e and then rendering the glyph for “ (the accent mark) such that the accent mark vvill appear 
over the e. İn this situation, a single Unicode character maps to multiple giyphs. 

e Giyph substitution - Some typography systems examine the nature of the textual content and utilize different 
gİyphs in different circumstances. For example, in Arabic, the same Unicode character might render as any 
of four different glyphs, depending on such factors as vvhether the character appears at the start, the end or 
the middle of a sequence of cursively ?oined characters. Different glyphs might be used for a punctuation 
character depending on inline-progression-direction (e.g., horizontal vs. vertical). In these situations, a single 
Unicode character might map to one of several alternative glyphs. 

e In some languages, particular sequences of characters vvill be converted into multiple glyphs such that parts 
of a particular character are in one giyph and the remainder of that character is in another giyph. 

e Alternative glyph specification - SVG contains a facility for the author to explicitly specify that a particular 
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sequence of Unicode characters is to be rendered using a particular giyph. (See Alternate glyphs.) VVhen this 
facility is used, multiple Unicode characters map to a single giyph. 


In many situations, the algorithms for mapping from characters to gİyphs are system-dependent, resulting in the 
possibility that the rendering of text might be (usually slightly) different vvhen vievved in different user environ- 
ments. If the author of SVG content requires precise selection of fonts and glyphs, then the recommendation is that 
the necessary fonts (potentially subsetted to include only the glyphs needed for the given document) be available 
either as SVG fonts embedded vvithin the SVG content or as VVebFonts (TCSS2l, section 15.1) posted at the same 
VVeb location as the SVG content. 

Throughout this chapter, the term character shall be equivalent to the definition of a character in XML 
EXML10). 


10.3 Fonts, font tables and baselines 


A font consists of a collection of glyphs together vvith the information (the font tables) necessary to use those 
giyphs to present characters on some medium. The combination of the collection of glyphs and the font tables is 
called the fonf data. The font tables include the information necessary to map characters to glyphs, to determine 
the size of gİyph areas and to position the giyph area. Each font table consists of one or more font characteristics, 
such as the font-vveight and font-style. 

The geometric font characteristics are expressed in a coordinate system based on the EM bax. (Ihe EM isa 
relative measure of the height of the giyphs in the font: see Coordinate units on the em square, in İCSS2), section 
15.4.3.) The box 1 EM high and 1 EM vvide is called the design space. This space is given a geometric coordinates 
by sub-dividing the EM into a number of unifs per em. 

Note: Units per em is a font characteristic. A typical value for units per em is 1000 or 2048. 

The coordinate space of the EM box is called the design space coordinate system. For scalable fonts, the curves 
and lines that are used to dravv a giyph are represented using this coordinate system. 

Note: Most often, the (0,0) point in this coordinate system is positioned on the left edge of the EM box, but 
not at the bottom left corner. The Y coordinate of the bottom of a roman capital letter is usually zero. And the 
descenders on lovvercase roman letters have negative coordinate values. 

SVG assumes that the font tables vvill provide at least three font characteristics: an ascent, a descent and a set 
of baseline-tables. The ascent is the distance to the top of the EM box from the (0,0) point of the font, the descent 
is the distance to the bottom of the EM box from the (0.0) point of the font. The baseline-table is explained belovv. 

Note: VVithin an OpenType font, for horizontal vvriting-modes, the ascent and descent are given by the sTy- 
poAscender and sTypoDescender entries in the O8/2 table. For vertical vrriting-modes, the descent (the distance, 
in this case from the (0,0) point to the left edge of the glyph) is normally zero because the (0,0) point is on the left 
edge. The ascent for vertical vvriting-modes is either 1 em or is specifted by the ideographic top baseline value in 
the Open Type Base table for vertical vvriting-modes. 

In horizontal vrriting-modes, the gİyphs of a given script are positioned so that a particular point on each 
giyph, the alignment-point, is aligned vvith the alignment-points of the other glyphs in that script. The glyphs of 
different scripts, for example, VVestern, Northern İndic and Far-Eastern scripts, are typically aligned at different 
points on the giİyph. For example, VVestern glyphs are aligned on the bottoms of the capital letters, northern indic 
giyphs are aligned at the top of a horizontal stroke near the top of the gİyphs and far-eastern glyphs are aligned 
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either at the bottom or center of the glyph. VVithin a script and vvithin a line of text having a single font-size, 
the sequence of alignment-points defines, in the inline- progression-direction, a geometric line called a baseline. 
VVestern and most other alphabetic and syllabic glyphs are aligned to an "alphabetic" baseline, the northern indic 
giyphs are aligned to a "hanging" baseline and the far-eastern gİyphs are aligned to an "ideographic" baseline. 

A baseline-table speciftes the position of one or more baselines in the design space coordinate system. The 
function of the baseline table is to facilitate the alignment of different seripts vvith respect to each other vvhen they 
are mixed on the same text line. Because the desired relative alignments may depend on vvhich seript is dominant 
in a İine (or block), there may be a different baseline table for each script. In addition, different alignment positions 
are needed for horizontal and vertical vvriting modes. Therefore, the font may have a set of baseline tables: typic- 
ally, one or more for horizontal vvrriting-modes and zero or more for vertical vvriting-modes. 

Note: Some fonts may not have values for the baseline tables. Heuristics are suggested for approximating the 
baseline tables vvhen a given font does not supply baseline tables. 

SVG further assumes that for each glyph in the font data for a font, there are tvvo vvidth values, tvvo 
alignment-baselines and tvvo alignment-points, one each for horizontal vvriting-modes and the other for vertical 
vvriting-modes. (Even though it is specifted as a vvidth, for vertical vvriting-modes the vvidth is used in the vertical 
direction.) The seript to vvhicdh a glyph belongs determines an alignment-baseline to vrhich the glyph is to be 
aligned. The inline-progression-direction position of the alignment-point is on the start-edge of the glyph. 

Properties related to baselines are described belovv under Baseline alignment properties. 

In addition to the font characteristics required above, a font may also supply substitution and positioning 
tables that can be used by a formatter to re-order, combine and position a sequence of gİyphs to make one or more 
composite glyphs. The combination may be as simple as a İigature, or as complex as an indic syllable vvhich com- 
bines, usually vvith some re-ordering, multiple consonants and vovvel giyphs. 


10.4 The “text” element 


The “text” element defines a graphics element consisting of text. The XML character data vvithin the “text” element, 
along vvith relevant attributes and properties and character-to-giyph mapping tables vvithin the font itself, define 
the giyphs to be rendered. (See Characters and their corresponding glyphs.) The attributes and properties on the 
“text” element indicate such things as the vvriting direction, font specification and painting attributes vvhich de- 
scribe hovv exactly to render the characters. Subsequent sections of this chapter describe the relevant text-specific 
attributes and properties, particular text layout and bidirectionality. 

Since “text” elements are rendered using the same rendering methods as other graphics elements, all of the 
same coordinate system transformations, painting, clipping and masking features that apply to shapes such as 
paths and rectangles also apply to “text” elements. 

İt is possible to apply a gradient, pattern, clipping path, mask or filter to text. VVhen one of these facilities 
is applied to text and keyvvord "obiectBoundingBox" is used (see Obyect bounding box units) to specify a graphical 
effect relative to the "obğect bounding box", then the obiect bounding box units are computed relative to the entire 
“text” element in all cases, even vvhen different effects are applied to different “ispan” elements vvithin the same 
“text” element. 

The “text” element renders its first glyph (after bidirectionality reordering) at the initial current text position, 
vvhich is established by the “x” and “y” attributes on the “text” element (vvith possible adiustments due to the value 
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of the “text-anchor” property, the presence of a “textPath” element containing the first character, and/or an “x”, “y”, 
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“dx” or “dy” attributes on a “tspan”, “tref” or “altGlyph” element vvhich contains the first character). After the glyph(s) 
corresponding to the given character is(are) rendered, the current text position is updated for the next character. 
In the simplest case, the nevv current text position is the previous current text position plus the glyphs" advance 
value (horizontal or vertical). See text layout for a description of gİyph placement and gİyph advance. 


Categories: ie 
Graphics element, text content element 


Content model: 
Any number of the follovving elements, in any order: 
animation elements 
descriptive elements 
text content child elements 


5) 


a 


Attributes: 
conditional processing attributes 
core attributes 
graphical event attributes 
presentation attributes 
“class” 
“style” 
“externalResourcesRequired” 
“transform” 
“IengthAdfust” 


... 


“rotate” 
“textLength” 


DOM Tnterfaces: 
SVGTextElement 


Attribute definitions: 


x — "-list-of-coordinates”" 
If a single -coordinates is provided, then the value represents the nevv absolute X coordinate for the current 
text position for rendering the glyphs that correspond to the first character vvithin this element or any of its 
descendants. 
If a comma- or space-separated list of nı -coordinatess is provided, then the values represent nevv absolute X 
coordinates for the current text position for rendering the glyphs corresponding to each of the first n charac- 


ters vvithin this element or any of its descendants. 

For additional processing rules, refer to the description of the “x” attribute on the “ispan” element. 
If the attribute is not specifted, the effect is as if a value of "0" vvere specifted. 

Animatable: yes. 
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y — "-list-of-coordinates”" 
"The corresponding list of absolute Y coordinates for the glyphs corresponding to the characters vvithin this 
element. The processing rules for the “y” attribute parallel the processing rules for the “x” attribute. 
If the attribute is not specifted, the effect is as if a value of "0" vvere specifted. 
Animatable: yes. 


dx — "-list-of-lengths-" 
Shifts in the current text position along the x-axis for the characters vvithin this element or any of its des- 
cendants. 
Refer to the description of the “dx” attribute on the “tspan” element. 
If the attribute is not specifted on this element or any of its descendants, no supplemental shifts along the 





x-axis vvill occur. 
Animatable: yes. 


dy — "-list-of-lengths-" 
Shifts in the current text position along the y-axis for the characters vvithin this element or any of its des- 
cendants. 
Refer to the description of the “dy” attribute on the “tspan” element. 
If the attribute is not specifted on this element or any of its descendants, no supplemental shifts along the 
y-axis vvill occur. 
Animatable: yes. 


rotate — "-list-of-numbers?" 
"The supplemental rotation about the current text position that vvill be applied to all of the giyphs corres- 
ponding to each character vvithin this element. 
Refer to the description of the “rotate” attribute on the “tspan” element. 
If the attribute is not specified on this element or any of its descendants, no supplemental rotations vvill oc- 
cur. 
Animatable: yes (non-additive). 


textLength - "-length-" 

The author"s computation of the total sum of all of the advance values that correspond to character data 
vvithin this element, including the advance value on the glyph (horizontal or vertical), the effect of proper- 
ties “kerning”, “Tetter-spacing” and “vord-spacing” and adfustments due to attributes “dx” and “dy” on “tspan” 
elements. This value is used to calibrate the user agent"s ovvn caleulations vvith that of the author. 

"The purpose of this attribute is to allovv the author to achieve exact alignment, in visual rendering order after 
any bidirectional reordering, for the first and last rendered giyphs that correspond to this element: thus, for 
the last rendered character (in visual rendering order after any bidirectional reordering), any supplemental 


inter-character spacing beyond normal giyph advances are ignored (in most cases) vvhen the user agent de- 
termines the appropriate amount to expand/compress the text string to fit vvithin a length of “textLengih”. 

A negative value is an error (see Error processing). 

If the attribute is not specifted, the effect is as if the authors computation exactly matched the value calcu- 
lated by the user agent, thus, no advance adiustments are made. 
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Animatable: yes. 


TengthAdiust — "spacingİspacingAndGliyphs" 
Imdicates the type of adiustments vvhich the user agent shall make to make the rendered length of the text 
match the value specifted on the “textLengih” attribute. 
"spacing" indicates that only the advance values are adiusted. The glyphs themselves are not stretched or com- 
pressed. 
"spacingAndGlyphs" indicates that the advance values are adfusted and the glyphs themselves stretched or 
compressed in one axis (i.e., a direction parallel to the inline-progression-direction). 
"The user agent is required to achieve correct start and end positions for the text strings, but the locations of 
intermediate gİyphs are not predictable because user agents might employ advanced algorithms to stretch or 
compress text strings in order to balance correct start and end positioning vvith optimal typography. 
Note that, for a text string that contains n characters, the adiustments to the advance values often occur only 
for n-1 characters (see description of attribute “textLength”), vvhereas stretching or compressing of the glyphs 





vvill be applied to all n characters. 
If the attribute is not specifted, the effect is as a value of "spacing" vvere specifted. 
Animatable: yes. 


Example text01 belovv contains the text string "Hello, out there" vvhich vvill be rendered onto the canvas using the 


Verdana font family vvith the giyphs filled vvith the color blue. 


c?xml versionz"1.0" standalone-"no"?z 
x DOCTYPE svg PUBLİC "-//V/3C/ //DTD SVG 1.1//EN" 
"http: / /vuv/.vV3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
€svg vidthe"10cm" height-"3cm" vievBoxz"0 0 1000 300" 
xmlnse"http:/ /vvv .vV3.0rg/2000/svg" versionze"1.1"5 
edescsExample text01 - "Hello, out there" in bluec/desc” 


etext xe"250" ye"150" 
font-family-"Verdana" font-sizez"55" fille"blue" x 
Hello, out there 
e/text- 


c1-- Shov outline of canvas using "rect" element --x 
crect xe"1" ye-"1" vidth-"998" height-"298" 
fill-"none" strokez"blue" stroke-vidthe"2" /s 
c/ svg” 


Example test01 





Hello, out there 
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10.5 The “tspan” element 


VVithin a “text” element, text and font properties and the current text position can be adiusted vvith absolute or 
relative coordinate values by including a “tspan” element. 





Categories: “tspan” 
Text content element, text content child element 


Content model: 
Any number of the follovving elements, in any order: 
descriptive elements 
“a” 
“altGiyph” 
“animate” 
“animateColor” 
ise 
“tref” 
“tspan” 


Attributes: 
conditional processing attributes 
core attributes 
graphical event attributes 
presentation attributes 
“class” 
“style” 


“externalResourcesRequired” 


aşk 


“rotafe” 
“textLength” 


“lengthAdfust” 


DOM Tnterfaces: 
SVGTSpanElement 
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Attribute definitions: 


x c "-list-of-coordinates:-" 
If a single -coordinates is provided, then the value represents the nevv absolute X coordinate for the current 
text position for rendering the giyphs that correspond to the first character vvithin this element or any of its 
descendants. 
If a comma- or space-separated list of nı -coordinate”s is provided, then the values represent nevv absolute X 





coordinates for the current text position for rendering the glyphs corresponding to each of the first n charac- 
ters vvithin this element or any of its descendants. 

If more -coordinate”s are provided than characters, then the extra -coordinatess vvill have no effect on giyph 
positioning. 

If more characters exist than -coordinatess, then for each of these extra characters: (a) if an ancestor “text” 
or “ispan” element specifies an absolute X coordinate for the given character via an “x” attribute, then that 
absolute X coordinate is used as the starting X coordinate for that character (nearest ancestor has preceden- 
ce), else (b) the starting X coordinate for rendering the gİyphs corresponding to the given character is the X 
coordinate of the resulting current text position from the most recently rendered giyph for the current “text” 
element. 

If the attribute is not specifted: (a) if an ancestor “text” or “tspan” element specifies an absolute X coordinate 
for a given character via an “x” attribute, then that absolute X coordinate is used (nearest ancestor has pre- 
cedence), else (b) the starting X coordinate for rendering the glyphs corresponding to a given character is 
the X coordinate of the resulting current text position from the most recently rendered giyph for the current 
“text” element. 

Animatable: yes. 


y — "-list-of-coordinates”" 
"The corresponding list of absolute Y coordinates for the glyphs corresponding to the characters vvithin this 
element. The processing rules for the “y” attribute parallel the processing rules for the “x” attribute. 
Animatable: yes. 


dx — "-list-of-lengths-" 

If a single -length” is provided, this value represents the nevv relative X coordinate for the current text pos- 
ition for rendering the glyphs corresponding to the first character vvithin this element or any of its descend- 
ants. The current text position is shifted along the x-axis of the current user coordinate system by -length” 
before the first character"s glyphs are rendered. 

If a comma- or space-separated list of nn -length”s is provided, then the values represent incremental shifts 
along the x-axis for the current text position before rendering the gİyphs corresponding to the first n char- 
acters vvithin this element or any of its descendants. Thus, before the glyphs are rendered corresponding to 


each character, the current text position resulting from dravving the giyphs for the previous character vvithin 
the current “text” element is shifted along the X axis of the current user coordinate system by -length”. 

If more -length:s are provided than characters, then any extra -length”s vvill have no effect on giyph posi- 
tioning. 
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If more characters exist than -lengthss, then for each of these extra characters: (a) if an ancestor “text” or 
“ispan” element speciftes a relative X coordinate for the given character via a “dx” attribute, then the current 
text position is shifted along the x-axis of the current user coordinate system by that amount (nearest an- 
cestor has precedence), else (b) no extra shift along the x-axis occurs. 

If the attribute is not specifted: (a) if an ancestor “text” or “tspan” element speciftes a relative X coordinate for 
a given character via a “dx” attribute, then the current text position is shifted along the x-axis of the current 
user coordinate system by that amount (nearest ancestor has precedence), else (b) no extra shift along the 
x-axis occurs. 

Animatable: yes. 





dy — "-list-of-lengths-" 
"The corresponding list of relative Y coordinates for the characters vvithin the “tspan” element. The processing 
rules for the “dy” attribute parallel the processing rules for the “dx” attribute. 
Animatable: yes. 


rotate — "-list-of-numbers?" 
The supplemental rotation about the current text position that vvill be applied to all of the giyphs corres- 
ponding to each character vvithin this element. 
If a comma- or space-separated list of -number:s is provided, then the first -number” represents the sup- 
plemental rotation for the glyphs corresponding to the first character vvithin this element or any of its des- 
cendants, the second -number” represents the supplemental rotation for the giyphs that correspond to the 
second character, and so on. 
If more -number”s are provided than there are characters, then the extra -number”s vvill be ignored. 
If more characters are provided than -number”s, then for each of these extra characters the rotation value 
specifled by the last number must be used. 
If the attribute is not specifted and if an ancestor “text” or “tspan” element specifles a supplemental rotation for 
a given character via a “rotate” attribute, then the given supplemental rotation is applied to the given charac- 
ter (nearest ancestor has precedence). If there are more characters than -number”s specifted in the ancestor"s 
“rotate” attribute, then for each of these extra characters the rotation value specified by the last number must 
be used. 
"This supplemental rotation has no impact on the rules by vvhich current text position is modifted as giyphs 
get rendered and is supplemental to any rotation due to text on a path and to “glyph-orientation-horizontal” 
or “glyph-orientation-vertical”. 


Animatable: yes (non-additive). 


textLength - "-length-" 
The author"s computation of the total sum of all of the advance values that correspond to character data 
vvithin this element, including the advance value on the glyph (horizontal or vertical), the effect of properties 
“kerning”, “etter-spacing” and “vvord-spacing” and adiustments due to attributes “dx” and “dy” on this “tspan” 
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element or any descendants. This value is used to calibrate the user agent"s ovvn calculations vvith that of the 
author. 

"The purpose of this attribute is to allovv the author to achieve exact alignment, in visual rendering order after 
any bidirectional reordering, for the first and last rendered giyphs that correspond to this element: thus, for 
the last rendered character (in visual rendering order after any bidirectional reordering), any supplemental 
inter-character spacing beyond normal glyph advances are ignored (in most cases) vvhen the user agent de- 
termines the appropriate amount to expand/compress the text string to fit vvithin a length of “textLength”. 

If attribute “texiLengih” is specified on a given element and also specifted on an ancestor, the adiustments on 
all character data vvithin this element are controlled by the value of “textLengih” on this element exclusively, 
vvith the possible side-effect that the adiustment ratio for the contents of this element might be different than 
the adiustment ratio used for other content that shares the same ancestor. The user agent must assume that 
the total advance values for the other content vvithin that ancestor is the difference betvveen the advance 
value on that ancestor and the advance value for this element. 

A negative value is an error (see Error processing). 

If the attribute is not specified anyvvhere vvithin a “text” element, the effect is as if the author"s computation 
exactly matched the value calculated by the user agent: thus, no advance adfustments are made. 
Animatable: yes. 


The “x”, “y,, “dx”, “dy” and “rotate” on the “tspan” element are useful in high-end typography scenarios vvhere in- 
dividual giyphs require exact placement. These attributes are useful for minor positioning adiustments betvveen 
characters or for maf?or positioning adiustments, such as moving the current text position to a nevv İlocation to 
achieve the visual effect of a nevv line of text. Multi-line “text” elements are possible by defining different “ispan” 
elements for each line of text, vvith attributes “x”, “y”, “dx” and/or “dy” defining the position of each “tspan”. (An ad- 
vantage of such an approach is that users vvill be able to perform multi-line text selection.) 

Im situations vvhere micro-level positioning adiustment are necessary for advanced typographic control, the 
SVG content designer needs to ensure that the necessary font vvill be available for all vievvers of the document 
(e.g., package up the necessary font data in the form of an SVG font or an alternative VVebFont format vvhich is 
stored at the same VVeb site as the SVG content) and that the vievving softvvare vvill process the font in the expected 
vvay (the capabilities, characteristics and font layout mechanisms vary greatly from system to system). If the SVG 
content contains “x”, “y”, “dx” or “dy” attribute values vvhich are meant to correspond to a particular font processed 
by a particular set of vievving softvvare and either of these requirements is not met, then the text might display 
vvith poor quality. 


The follovving additional rules apply to attributes “x”, “y”, “dx”, “dy” and “rotate” vvhen they contain a list of 


numbers: 


ə VVhen a single XML character maps to a single giyph - In this case, the i-th value for the “x”, “y”, “dx”, “dy” and 
“rotate” attributes is applied to the glyph that corresponds to the i-th character. 

e VVhen a single XML character maps to multiple glyphs (e.g., vvhen an accent giİyph is placed on top of a 
base giyph) - In this case, the i-th value for the “x”, “y”, “dx” and “dy” values are applied (i.e., the current text 
position is adiusted) before rendering the first glyph. The rotation transformation corresponding to the i-th 


“rotate” value is applied to the giyphs and to the inter-giyph advance values corresponding to this character 


on a group basis (i.e., the rotation value creates a temporary nevv rotated coordinate system, and the glyphs 
orresponding to the character are rendered into this rotated coordinate system). 
ə VVhen multiple XML characters map to a single giİyph (e.g., vvhen a ligature is used) - Suppose that the i-th 


€ öc 


and (1-1)-th XML characters map to a single glyph. In this case, the i-th value for the “x”, “y”, “dx”, “dy” and 


Ara ə 


“rotate” attributes all apply vvhen rendering the giyph. The (i--1)-th values, hovvever, for “x”, “y” and “rotate” are 
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ignored (exception: the final “rotate” value in the list vvould still apply to subsequent characters), vvhereas the 
“dx” and “dy” are applied to the subsequent XML character (i.e., the (1:2)-th character), if one exists, by trans- 
lating the current text position by the given amounts before rendering the first glyph associated vvith that 
character. 

e VVhen there is a many-to-many mapping of characters to glyphs (e.g., vvhen three characters map to tvvo 
gİyphs, such as vvhen the first giyph expresses the first character and half of the second character, and the 
second giİyph expresses the other half of the second character plus the third character) - Suppose that the i-th, 
(1-1)-th and (i--2)-th XML characters map to tvvo gİyphs. In this case, the i-th value for the “x”, “y”,, “dx” and 
“dy” values are applied (i.e., the current text position is adiusted) before rendering the first giyph. The rotation 





transformation corresponding to the i-th “rotate” value is applied to both the tvvo giyphs and the giyph ad- 
vance values for the first giyph on a group basis (i.e., the rotation value creates a temporary nevv rotated co- 
ordinate system, and the tvvo giyphs are rendered into the temporary rotated coordinate system). The (i--1)-th 
and (i--2)-th values, hovvever, for the “x”, “y” and “rotate” attributes are not applied (exception: the final “rotate” 
value in the list vvould still apply to subsequent characters), vrhereas the (i-1)-th and (i--2)-th values for the 
“dx” and “dy” attributes are applied to the subsequent XML character (i.e., the (i--3)-th character), if one exists, 
by translating the current text position by the given amounts before rendering the first glyph associated vvith 
that character. 

e Relationship to bidirectionality - As deseribed belovv in the discussion on bidirectionality, text is laid out in 
a tvro-step process, vvhere any bidirectional text is first re-ordered into a left-to-right string, and then text 
layout occurs vvith the re-ordered text string. V/henever the character data vvithin a “ispan” element is re- 
ordered, the corresponding elements vvithin the “x”, “y”, “dx”, “dy” and “rotate” are also re-ordered to maintain 


the correspondence. For example, suppose that you have the follovving “ispan” element: 
ctspan dxe"11 12 13 14 15 0 21 22 23 0 31 32 33 34 35 36"əoLatin and Hebrev-c/tspanx 


and that the vvord "Hebrevv" vvill be dravvn right-to-left. First, the character data and the corresponding values 
in the “dx” İist vvill be reordered, such that the text string vvill be "Latin and vverbeH" and the list of values 
for the “dx” attribute vvill be "11 12 13 14 15 0 21 22 23 0 36 35 34 33 32 31". After this re-ordering, the gilyphs 
corresponding to the characters vvill be positioned using standard left-to-right layout rules. 


"The follovving examples shovv basic use of the “tspan” element. 
Example tspan01 uses a “tspan” element to indicate that the vvord "not" is to use a bold font and have red fill, 


c?xml versionz"1.0" standalone-"no"?z 
xc DOCTYPE svg PUBLİC "-//V/3C/ /DTD SVG 1.1//EN" 
"http: / /vvv/.vV3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
€svg vidthe"10cm" height-"3cm" vievBoxz"0 0 1000 300" 
xmlnse"http://vuv/.v3.0Tg/2000/svg" versionz"1.1"5 
edescsExample tspan01 - using tspan to change visual attributes-/desc” 


€g font-family-"Verdana" font-sizez"45" x 
etext xe"200" ye"150" fill-"blue" 5 
You are 


c€tspan font-veight-"bold" fill-"red" snot-c/tspanx 
a banana. 
c/text- 
x/g” 


c1-- Shov outline of canvas using "rect" element --5 
crect xe"1" y-"1" vidth-"998" height-"298" 
fill-"none" stroke-"blue" stroke-vidthe"2" /s 
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x/ svg” 


Example tspan01 





You are not a banana. 








Example tspan02 uses the “dx” and “dy” attributes on the “tspan” element to adfust the current text position hori- 
zontally and vertically for particular text strings vvithin a “text” element. 


c?xml versionz"1.0" standalone-"no"?z 
€ DOCTYPE svg PUBLİC "-//V3C//DTD SVG 1.1//EN" 
"http: / /vvv/.v/3.org/Graphics/SVG/1.1/DTD/svg11.dtd"s 
x€svg vidth-"10cm" height-"3cm" vievBox-"0 0 1000 300" 
xmlnsze"http: / /vv/ .vV3.0T9/2000/svg" versionz"1.1"5 
edescsExample tspan02 - using tspan"s dx and dy attributes 
for incremental positioning adiustments-/desc” 


s€g font-family-"Verdana" font-sizez"45" 5 
etext xe"200" y-"150" fill-"blue" 5 
But you 
ctspan dxe"2em" dyz"-50" font-veight-"bold" fill-"red" 5 
are 
c/ tspan” 
etspan dyz"100"5 
a peachl 
c/ tspanx 
c/text- 
x/g” 


c1-- Shov outline of canvas using "rect" element --x 
crect xe"1" y-"1" vidth-"998" height-"298" 
fill-"none" strokez"blue" stroke-vidthe"2" /s 
s/ svg” 


Example tspan02 





are 
But you 


a peachl 








Example tspan03 uses the “x” and “y” attributes on the “ispan” element to establish a nevv absolute current text po- 
sition for each giyph to be rendered. "The example shovvs tvvo lines of text vvithin a single “text” element. Because 


both lines of text are vvithin the same “text” element, the user vvill be able to select through both lines of text and 
copy the text to the system clipboard in user agents that support text selection and clipboard operations. 


c?xml versionz"1.0" standalonez"no"?x 
ce DOCTYPE svg PUBLİC "-//V3C//DTD SVG 1.1//EN" 
"http: / /vuv/.vV3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
x€svg vidth-"10cm" height-"3cm" vievBox-"0 0 1000 300" 
xmlnsz"http: / /vv/ .vV3.0T9/2000/svg" versionz"1.1"5 
edescsExample tspan03 - using tspan"s x and y attributes 
for multiline text and precise glyph positioning-c/descə” 
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s€g font-family-"Verdana" font-sizez"45" 5 
etext fille"rgb(255,164,0)" x 
ctspan xz"300 350 400 450 500 550 600 650" yz"100"5 
Cute and 
c/tspanx 
e€tspan xz"375 425 475 525 575" ye"200"5 
Tuzzy 
c/tspanx 
s/text- 
x/g” 





c1-- Shov outline of canvas using "rect" element --x 
crect xe"1" y-"1" vidth-"998" height-"298" 
fill-"none" strokez"blue" stroke-vidthe"2" /s 
xc/ svg” 


Example tspan03 





Cute and 


fuzzy 











Example tspan04 uses the “rotate” attribute on the “ispan” element to rotate the glyphs to be rendered. This example 
shovvs a single text string in a “tspan” element that contains more characters than the number of values specifted 
in the “rotate” attribute. In this case the last value specifted in the “rotate” attribute of the “tspan” must be applied to 
the remaining characters in the string. 


c?xml versionz"1.0" standalone-"no"?z 
€ DOCTYPE svg PUBLİC "-//V3C//DTD SVG 1.1//EN" 
"http: / /uvnv .vV3..org/Graphics/SVG/1.1/DTD/svg11.dtd"x 
s€svg vidth-"10cm" height-"3cm" vievBox-"0 0 1000 300" 
xmlnse"http: / /uvv .v/3.0T9/2000/svg" versionze"1.1"5 
edescs 
Example tspan04 - The number of rotate values is less than the number of 
characters in the string. 
s/desc- 
etext font-family-"Verdana" font-sizez"55" fill-"blue" x 
ctspan xe"250" yez"150" rotatez"-30,0,30"- 
Hello, out there 
c/tspanx 
se/text- 
c1-- Shov outline of canvas using "rect" element --5 
crect xe"1" y-"1" vidth-"998" height-"298" 
fill-"none" strokez"blue" stroke-vidthe"2" /s 
x/ svg” 


Example tspan04 





V.e/o, ogc 65e?e 
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Example tspan05 speciftes the “rotate” attribute on the “text” element and on all but one of the child “ispan” elements 
to rotate the glyphs to be rendered. The example demonstrates the propagation of the “rotate” attribute. 


c?xml versionz"1.0" standalone-"no"?x 
€ DOCTYPE svg PUBLİC "-//V3C//DTD SVG 1.1//EN" 
"http: / /uvnv .vV3.0rTg/Graphics/SVG/1.1/DTD/svg11.dtd"x 
x€svg vidth-"1005" height-"1005" vievBoxz"0 0 500 120" 
xmlnse"http: / /uvv .vV3.0rg/2000/svg" versionze"1.1"5 
xedescə- 
Example tspan05 - propagation of rotation values to nested tspan elements. 
xe/descs 
etext id-"parent" font-family-"Arial, sans-serif" font-sizez"32" fill-"red" xe"40" yz"40" 
rotatez"5,15,25,35,45,55"5 
Not 





e€tspan ide-"child1" rotatez"-10, -20,-30,-40" fill-"orange"z 
all characters 


ctspan ide"child2" rotatez"70,60,50,40,30,20,10" fill-"yellov"z 
in 


c€tspan ide"child3"- 
the 
c/ tspan” 
c/ tspan” 


cetspan ide"child4" fill-"orange" xz"40" yz"90"- 
text 
c/tspan” 


have a 
c/tspan” 


ctspan ide"child5" rotatez"-10" fill-"blue"s 
specified 
c/tspanx 


rotation 
c/text- 


xc1-- Shov outline of canvas using "rect" element --x5 
crect xe"1" y-"1" vidth-"498" height-"118" fill-"none" 
strokez"blue" stroke-vidthe"2" /s 
x/svg” 


Example tspan05 
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Rotation of red text inside the “text” element: 


e “The “rotate” value vvill rotate the characters in the text "Not " by 5, 15, 25 and 35 degrees respectively. 
e A “rotate” value is applied to the space that follovvs the text "Not" to the space in betvveen the text in the 





"child1" and "child5" “ispan” elements, and to the space before the text "rofafion". 

e "The next current “rotate” value specifted is 45 follovved by 55. The current “Totate” value in the “text” element is 
incremented as subsequent characters in the text of the child “ispan” elements are processed. 

e "he next immediate “ispan” element speciftes rotate values for the text, hence the current “Trotate” value vvill 
change to the next value in the list (but is not used) as each character is processed until the last value of 55 
degrees is reached. 

e “The last “rotate” value of 55 degrees vvill be applied to all the characters in the text "rofafion". 


"ee 


Rotation of the orange text inside the "child1" “ispan” element: 

e "The "rotate” value vvill rotate the first 4 characters in the text "a// characters " by -10, -20, -30 and -40 respect- 
ively. 

e “The last "rotate” value of -40 becomes the current “rotate” value and vvill be applied to all subsequent characters 
in the “tspan” element and to any child “ispan” elements that do not specify “rotate” values. 

e "The "childa" “ispan” element does not specify any “rotate” values and thus uses the current “rotate” of its ancest- 
or ("child1" “ispan” element). AİI the characters in the text "fexf" specifted vvithin the "childa" “tspan” element 
vvill be rotated by -40 degrees. 

e “İhe last “rotate” value of -40 degrees vvill be applied to all the characters in the text "have a". 

e A “rotate” value is applied to the space in betvveen the text in the "child2" and "childa" “ispan” elements, and to 


the space before the text "have a". 
Rotation of the yellovv text inside the "child2" “ispan” element: 


e "Ihe “rotate” value vvill rotate the characters in the (yellovv) text "in " by 70, 60, and 50 degrees respectively. 

e A “rotate” value is applied to the space that follovvs the text "in". 

e "Ihere are more “rotate” values specifted than characters, thus the additional “rotate” values vvill be applied to 
the "child3" “span” element vvhich does not specifted any “Totate” values. 


e "The characters in the text "fhe" specifted vvithin the "child3" “ispan” element vvill be rotated 40, 30 and 20 de- 
grees respectively. 


Rotation of the blue text inside the "child5" “ispan” element: 
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e "The "rotate” value vvill rotate all the characters in text "specified" by -10 degrees. 
e Only one “rotate” value is specifted and is thus applied to all characters in the “tspan” element. 


The follovving diagram illustrates hovv the rotation values propagate to “tspan” elements nested vvithing a “text” 


element 





VV3C Recommendation 





ctext id”"parent" font-family”"Arial, sans-serif" font-sizem"18" 
xe"3ü" ye"200" rotate-"5,15,25,35,45,55"52 


- B -. 


ctspan id-"childi" rotatem"-10,-20,-30,-40"5 


-10 -20 30 -40 -40 40 -40 40 40 -40 40 40 -40 40 -40 


ctspan id-"child2" rotate-"70,60,50,40,30,20,10"5 


?0 60 50 
ctspan id-"child3"- 


40 30 20 
c/?tspan- 
c/”tspan” 


-0 


ctspan id-"child4"- 


-40 40 -40 -40 
c/tspan” 


LI 
-40 
EhlafvTeT Tal 


-A0 -40 40 40 -40 40 
c/”tspan” 


Lə 


ctspan id-"child5" rotatem"-10"5- 


-10 -10 -10 -10 -10 -10 -10 -10 -10 
x/ötspan” 


LI) 
55 
LrToltİaltİiloini 


55 55 533 55 55 55 535 55 
c/texto 
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10.6 The “tref” element 


"The textual content for a “text” can be either character data directly embedded vvithin the “text” element or the 
character data content of a referenced element, vvhere the referencing is specifled vvith a “tref” element. 


Categories: “tref” 
Text content element, text content child element 


Content model: 
Any number of the follovving elements, in any order: 
descriptive elements 
“animate” 
“animateColor” 


“set” 


Attributes: 
conditional processing attributes 
core attributes 
graphical event attributes 
presentation attributes 
xlink attributes 
“class” 
“style” 
“externalResourcesRequired” 
“xlink:href” 


DOM Interfaces: 
SVGTRefElement 


Attribute definitions: 


xlink:href — "-iri-" 
An IRI reference to an element vvhose character data content shall be used as character data for this “tref” 
element. 
Animatable: yes. 


AlI character data vvithin the referenced element, including character data enclosed vvithin additional markup, vvill 
be rendered. 

The “x”, "y”, “dx”, “dy” and “rotate” attributes have the same meanings as for the “tspan” element. The attributes 
are applied as if the “tref” element vvas replaced by a “tspan” vvith the referenced character data (stripped of all 
supplemental markup) embedded vvithin the hypothetical “tspan” element. 

Example tref01 shovvs hovv to use character data from a different element as the character data for a given 


“ispan” element. The first “text” element (vvith id-"ReferencedText") vvill not dravv because it is part of a “defs” ele- 
ment. The second “text” element dravvs the string "Inline character data". The third “text” element dravvs the string 
"Reference character data" because it includes a “tref” element vvhich is a reference to element "Referenced Text", 
and that elements character data is "Referenced character data". 
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c?xml versionz"1.0" standalone-"no"?z 
€ DOCTYPE svg PUBLİC "-//03C//DTD SVG 1.1//EN" 
"http: / /vvv/ .vV3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
s€svg vidth-"10cm" height-"3cm" vievBoxz"0 0 1000 300" version-"1.1" 
xmlnsz"http: / /vuv/ .vV3.0T9/2000/svg" xmlns:xlinke"http://vvv.v3.org/1999/xlink"s 
edefso 
etext id-"ReferencedText"s 
Referenced character data 
c/text- 
s/defss 
ecdescsExample tref01 - inline vs reference text content-/desc” 


etext xz"100" y-"100" font-sizez"45" fill-"blue" x 
Inline character data 

c/text- 

etext xz"100" y-"200" font-sizez"45" fill-"red" xs 
etref xlink:href-"ZReferencedText"/x5 

c/text- 





c1-- Shov outline of canvas using "rect" element --x 
crect xe"1" y-"1" vidth-"998" height-"298" 
fill-"none" strokeze"blue" stroke-vidthe"2" /s 
s/ svg” 


Example tref01 





inline character data 


Referenced character data 











10.7 Text layout 


10.7.1 Text layout introduction 


"This section describes the text layout features supported by SVG, vvhich includes support for various international 
vvriting directions, such as left-to-right (e.g., Latin scripts) and bidirectional (e.g., Hebrevv or Arabic) and vertical 
(e.g., Asian scripts). The deseriptions in this section assume straight line text (i.e., text that is either strictly ho- 
rizontal or vertical vvith respect to the current user coordinate system). Subsequent sections describe the supple- 
mental layout rules for text on a path. 

SVG does not provide for automatic line breaks or vvord vvrapping, vvhich makes internationalized text layout 
for SVG relatively simpler than it is for languages vvhich support formatting of multi-line text blocks. 

For each “text” element, the SVG user agent determines the current reference orientation. For standard ho- 
rizontal or vertical text (i.e., no text-on-a-path), the reference orientation is the vector pointing tovvards negative 
infinity in Y vvithin the current user coordinate system. (Note: in the initial coordinate system, the reference ori- 
entation is up.) For text on a path, the reference orientation is reset vvith each character. 


c 
.o 
5 
İv) 
m") 
(s 
(3) 
c 
E 
ə) 
(ə) 
o 
ad 
. 
s 





Based on the reference orientation and the value for property “vvriting-mode”, the SVG user agent determines 
the current inline-progression-direction. For left-to-right text, the inline-progression-direction points 90 degrees 
clockvvise from the reference orientation vector. For right-to-left text, the inline progression points 90 degrees 
counter-clockvvise from the reference orientation vector. For top-to-bottom text, the inline-progression-direction 
points 180 degrees from the reference orientation vector. 

Based on the reference orientation and the value for property “vrriting-mode”, the SVG user agent determines 
the current block-progression-direction. For left-to-right and right-to-left text, the block-progression-direction 
points 180 degrees from the reference orientation vector because the only available horizontal “vrriting-mode”s are 
İr-tb and rl-tb. For top-to-bottom text, the block-progression-direction alvvays points 90 degrees counter-clockvvise 
from the reference orientation vector because the only available top-to-bottom “vvriting-mode” is tb-rl. 

The shift direction is the direction tovvards vvhich the baseline table moves due to positive values for property 
“baseline-shift”. The shift direction is such that a positive value shifts the baseline table tovvards the topmost entry 
in the parent/s baseline table. 

Im processing a given “text” element, the SVG user agent keeps track of the current text position. The initial 
current text position is established by the “x” and “y” attributes on the “text” element. 

The current text position is adyusted after each glyph to establish a nevv current text position at vvhich the next 
giyph shall be rendered. The adiustment to the current text position is based on the current inline-progression-dir- 
ection, glyph-specific advance values corresponding to the glyph orientation of the glyph yust rendered, kerning 
tables in the font and the current values of various attributes and properties, such as the spacing properties and 
any “x”, “y”, “dx” and “dy” attributes on “text”, “tspan”, “tref” or “altGiyph” elements. If a giyph does not provide ex- 
plicit advance values corresponding to the current glyph orientation, then an appropriate approximation should 
be used. For vertical text, a suggested approximation is the sum of the ascent and descent values for the glyph. 
Another suggested approximation for an advance value for both horizontal and vertical text is the size of an em 
(see units-per-em). 

For each glyph to be rendered, the SVG user agent determines an appropriate alignment-point on the gilyph 
vvhich vvill be placed exactly at the current text position. The alignment-point is determined based on giyph 
cell metrics in the giyph itself, the current inline-progression-direction and the glyph orientation relative to the 
inline-progression-direction. For most uses of Latin text (i.e., vvriting-mode:lr, text-anchor:start and alignment- 
baseline:baseline) the alignment-point in the glyph vvill be the intersection of left edge of the giyph cell (or some 
other glyph-specific x-axis coordinate indicating a left-side origin point) vvith the Latin baseline of the glyph. For 
many cases vvith top-to-bottom vertical text layout, the reference point vvill be either a glyph-specific origin point 
based on the set of vertical baselines for the font or the intersection of the center of the glyph vvith its fop fine 
(see Top Baseline, in TCSS2), section 15.4.18). If a glyph does not provide explicit origin points corresponding to 
the current glyph orientation, then an appropriate approximation should be used, such as the intersection of the 
left edge of the glyph vvith the appropriate horizontal baseline for the glyph or intersection of the top edge of 
the giyph vvith the appropriate vertical baseline. If baseline tables are not available, user agents should establish 
baseline tables that reflect common practice. 

Adiustments to the current text position are either absolute position adiustments or relative position ad- 
ğustmenis. An absolute position adiustment occurs in the follovring circumstances: 


e At the start of a “ext” element 
e At the start of each “textPath” element 
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e For each character vvithin a “text”, “ispan”, “tref” and “altGlyph” element vvhich has an “x” or “y” attribute value 


assigned to it explicitly 


AlI other position adiustmenits to the current text position are relative position adiustments. 
Each absolute position adiustment defines a nevv text chunk. Absolute position adiustments impact text lay- 
out in the follovving vvays: 


e Ligatures only occur vvhen a set of characters vvhich might map to a ligature are all in the same text chunk. 
e Each text chunk represents a separate block of text for alignment due to “text-anchor” property values. 
ə Reordering of characters due to bidirectionality only occurs vvithin a text chunk. Reordering does nof happen 


across text chunks. 
The follovving additional rules apply to ligature formation: 


e As defined in CSS2, (TCSS2), section 16.4), vvhen the resultant space betvveen tvvo characters is not the same 
as the default space, user agents should not use ligatures: thus, if there are non-default values for properties 
“kerning” or "Tetter-spacing”, the user agent should not use ligatures. 

e Ligature formation should not be enabled for the glyphs corresponding to characters vvithin different DOM 
text nodes: thus, characters separated by markup should not use ligatures. 

e As mentioned above, ligature formation should not be enabled for the glyphs corresponding to characters 


vvithin different text chunks. 


10.7.2 Setting the inline-progression-direction 


The “vrriting-mode” property specifies vhether the initial inline-progression-direction for a “text” element shall be 
left-to-right, right-to-left, or top-to-bottom. The “vriting-mode” property applies only to “text” elements: the prop- 
erty is ignored for “tspan”, “tref”, “altGiyph” and “textPath” sub-elements. (Note that the inline-progression-direc- 
tion can change vvithin a “text” element due to the Unicode bidirectional algorithm and properties “direction” and 
“unicode-bidi”. For more on bidirectional text, see Relationship vvith bidirectionality.) 


Value: İr-tb 1 rl-tb:1 tb-rl 1 lr 1 rl 1tb. 1 inherit 
Initial: İr-tb 

Applies to: “text” elements 

inherited: yes 


Percentages: N/A 
Media: visual 
Animatable: no 


İr-tb 1 İr 
Sets the initial inline-progression-direction to İeft-to-right, as is common in most Latin-based documents. 
For most characters, the current text position is advanced from left to right after each glyph is rendered. 
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(VVhen the character data includes characters vvhich are subiect to the Unicode bidirectional algorithm, the 
text advance rules are more complex. See Relationship vvith bidirectionality). 

rİ-tb I rl 
Sets the initial inline-progression-direction to right-to-left, as is common in Arabic or Hebrevv scripts. (See 
Relationship vvith bidirectionality.) 

tb-rl 1 tb 
Sets the initial inline-progression-direction to top-to-bottom, as is common in some Asian seripts, such as 
Chinese and )apanese. Though hardiy as frequent as horizontal, this type of vertical layout also occurs in 
Latin based documents, particularly in table column or rovr labels. In most cases, the vertical baselines run- 


ning through the middle of each glyph are aligned. 


10.7.3 Gliyph orientation vvithin a text run 


In some cases, it is required to alter the orientation of a sequence of characters relative to the inline-progression- 
direction. The requirement is particularly applicable to vertical layouts of East Asian documents, vrhere sometimes 
narrovv-cell Latin text is to be displayed horizontally and other times vertically. 

Tevo properties control the giyph orientation relative to the reference orientation for each of the tvvo possible 
inline-progression-directions. “glyph-orientation-vertical” controls glyph orientation vvhen the inline-progression- 
direction is vertical. “glyph-orientation-horizontal” controls gİyph orientation vvhen the inline-progression-direc- 


tion is horizontal. 


Value: auto İ cangles 1 inherit 
lnitial: auto 

Applies to: (text content elements 
İnherited: yes 

Percentages: N/A 

Media: visual 


Animatable: no 
auto 


ə Fullvvidth ideographic and fullvvidth Latin text vvill be set vvith a glyph-orientation of 0-degrees. 
Ideographic punetuation and other ideographic characters having alternate horizontal and vertical 
forms vvill use the vertical form of the glyph. 
ə Text vvhich is not fullvvidth vvill be set vvith a glyph-orientation of 90-degrees. 
This reorientation rule applies only to the first-level non-ideographic text. AİI further embedding 
of vvriting-modes or bidi processing vvill be based on the first-level rotation. 


NOTE: 


o "This is equivalent to having set the non-ideographic text string horizontally honoring 
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the bidi-rule, then rotating the resultant sequence of inline-areas (one area for each 
change of giyph direction) 90-degrees clockvvise. 

It should be noted that text set in this "rotated" manner may contain ligatures or 
other giyph combining and reordering common to the language and seript. (Ihis "ro- 
tated" presentation form does not disable auto-ligature formation or similar context- 
driven variations.) 

o "Ihe determination of vvhich characters should be auto-rotated may vary across user 
agents. The determination is based on a complex interaction betvveen country, lan- 
guage, seript, character properties, font, and character context. İt is suggested that one 
consult the Unicode TR 11 and the various İIS or other national standards. 


xangle- 
"The value of the angle is restricted to 0, 90, 180, and 270 degrees. The user agent shall round the value of the 
angle to the closest of the permitted values. 
A value of odeg indicates that all glyphs are set vvith the top of the glyphs oriented tovvards the reference 
orientation. A value of 90deg indicates an orientation of 90 degrees clockvvise from the reference orientation. 


"This property is applied only to text vvritten in a vertical “vrriting-mode”. 

The glyph orientation affects the amount that the current text position advances as each giyph is rendered. 
VVhen the inline-progression-direction is vertical and the “glyph-orientation-vertical” results in an orientation angle 
that is a multiple of 180 degrees, then the current text position is incremented according to the vertical metrics of 
the glyph. Othervvise, if the “glyph-orientation-vertical” results in an orientation angle that is not a multiple of 180 
degrees, then the current text position is incremented according to the horizontal metrics of the glyph. 

The text layout diagrams in this section use the follovving symbols: 


vvide-cell giyph (e.g. Han) vvhich is the n-th giyph in the text run 





bl narrovv-cell glyph (e.g. Latin) vvhich is the n-th giyph in the text run 


"The orientation vvhich the above symbols assume in the diagrams corresponds to the orientation that the Unicode 
characters they represent are intended to assume vvhen rendered in the user agent. Spacing betvveen the glyphs in 
the diagrams is usually symbolic, unless intentionally changed to make a point. 

The diagrams belovv illustrate different uses of “glyph-orientation-vertical”. The diagram on the left shovvs the 
result of the mixing of full-vvidth ideographic glyphs vvith narrovv-cell Latin giyphs vvhen “giyph-orientation-ver- 
tical” for the Latin characters is either auto or 90. The diagram on the right shovv the result of mixing full-vvidth 
ideographic giyphs vvith narrovv-cell Latin glyphs vvhen Latin glyphs are specifted to have a “glyph-orientation- 


vertical” of 0. 
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Value: xangles 1 inherit 
lnitial: Odeg 

Applies to: (text content elements 
inherited: yes 

Percentages: N/A 

Media: visual 


Animatable: no 


xangle- 
"The value of the angle is restricted to 0, 90, 180, and 270 degrees. The user agent shall round the value of the 
angle to the closest of the permitted values. 
A value of odeg indicates that all glyphs are set vvith the top of the glyphs oriented tovvards the reference 
orientation. A value of 90deg indicates an orientation of 90 degrees clockvvise from the reference orientation. 


"This property is applied only to text vvritten in a horizontal “vriting-mode”. 

The glyph orientation affects the amount that the current text position advances as each giİyph is rendered. 
VVhen the reference orientation direction is horizontal and the “glyph-orientation-horizontal” results in an orient- 
ation angle that is a multiple of 180 degrees, then the current text position is incremented according to the hori- 
zontal metrics of the glyph. Othervvise, if the “glyph-orientation-horizontal” results in an orientation angle that is 
not a multiple of 180 degrees, then the current text position is incremented according to the vertical metrics of the 


giyph. 
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10.7.4 Relationship vvith bidirectionality 


"The characters in certain scripts are vvritten from right to left. In some documenits, in particular those vvritten vvith 
the Arabic or Hebrevv script, and in some mixed-language contexis, text in a single line may appear vvith mixed 
directionality. This phenomenon is called bidirectionality, or "bidi" for short. 

The Unicode standard (TUNICODE), specifically TUAX91) defines a complex algorithm for determining the 
proper directionality of text. The algorithm consists of an implicit part based on character properties, as vvell as 
explicit controls for embeddings and overrides. The SVG user agent applies this bidirectional algorithm vvhen de- 
termining the layout of characters vvithin a text content block element. 

The “direction” and “unicode-bidi” properties allovv authors to override the inherent directionality of the con- 
tent characters and thus explicitly control hovv the elements and attributes of a document language map to this 
algorithm. These tvvo properties are applicable to all characters vvhose glyphs are perpendicular to the inline- 
progression-direction. 

m many cases, the bidirectional algorithm from Unicode PUNICODEİ produces the desired result automat- 
ically, and in sudh cases the author does not need to use these properties. For other cases, such as vrhen using 
right-to-left languages, it may be sufficient to add the “direction” property to the rootmost “svg” element, and allovv 
that direction to inherit to all text elements, as in the follovving example (vvhich may be used as a template): 


x€svg xmlnsze"http:/ /uvv/.v3.org/2000/svg" 
vidth-"10086" height-"1005" vievBoxz"0 0 400 400" 
directione"rt1" xml:lange"fa" 


etitle direction-"ltr" xml:lang-"en"-Right-to-left Textc/titles 
edesc directione"ltr" xml:lange"en"z 
A simple example for using the "direction" property in documents 
that predominantly use right-to-left languages. 
s/desc- 


etext x-"200" y-"200" font-sizez"20"596xər SVG 1.1 SE sət 5 Y,b.c/textə 


s/ svg” 


Example 


Qala SVG 1.1 SE ual ə €. yl, 


Belovv is another example, vvhere vvhere implicit bidi reordering is not suflcient: 


c?xml versione"1.0" encoding-"utf-8"7- 

x€svg xmlnse"http:/ /uvv/.v3.org/2000/svg" 
vidth-"10086" height-"1005" vievBoxz"0 0 400 400" 
directione"rt1" xml:lange"he"x 


etitle directione"ltr" xml:lang-"en"-Right-to-left Textc/titlec 
edesc directione"ltr" xml:lange"en"xz 
An example for using the "direction" and "unicode-bidi" properties 
in documents that predominantly use right-to-left languages. 
s/desc- 


etext xz"200" y-"200" font-sizez"20"5 nın? 
MAC :8Fx200F , 
cetspan directionze"ltr" unicode-bidiz"embed"x00-24-AF-2A-55-FC-/tspanx 
c/ text” 
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s/ svg” 


Example 


nan? MAC: 00-24-AF-2A-55-FC 


VVithin text content elements, the alignment of text vvith regards to the “text-anchor” property is determined by 
the value of the “direction” property. For example, given a “text” element vvith a “text-anchor” value of "end", for a 
“direction” value of "lir", the text vvill extend to the left of the position of the “text” elements “x” attribute value, 
vvhile for “direction” value of "rtl", the text vvill extend to the right of the position of the “text” elements “x” attribute 
value. 

A more complete discussion of bidirectionality can be found in the Text direction section of CSS 2 (İCSS2İ1, 
section 9.10). 

The processing model for bidirectional text is as follovvs. The user agent processes the characters vvhich are 
provided in İlogical order (i.e., the order the characters appear in the original document, either via direct inclusion 
or via indirect reference due a “tref” element). The user agent determines the set of independent blocks vvithin each 
of vvhich it should apply the Unicode bidirectional algorithm. Each text chunk represents an independent block of 
text. Additionally, any change in gİyph orientation due to processing of properties “glyph-orientation-horizontal” or 
“glyph-orientation-vertical” vvill subdivide the independent blocks of text further. After processing the Unicode bi- 
directional algorithm and properties “direction” and “unicode-bidi” on each of the independent text blocks, the user 
agent vvill have a potentially re-ordered list of characters vvhich are novr in left-to-right rendering order. Simul- 
taneous vvith re-ordering of the characters, the dx, dy and rotate attributes on the “tspan” and “tref” elements are 
also re-ordered to maintain the original correspondence betvveen characters and attribute values. VVhile kerning 
or ligature processing might be font-specific, the preferred model is that kerning and ligature processing occurs 
betvveen combinations of characters or glyphs after the characters have been re-ordered. 


Value: İtr 1 ril 1 inherit 
lnitial: İtr 
Applies to: text content elements 


Inherited: yes 
Percentages: N/A 
Media: visual 


Animatable: no 


"This property speciftes the base vvriting direction of text and the direction of embeddings and overrides (see 
“unicode-bidi”) for the Unicode bidirectional algorithm. For the “direction” property to have any effect on an element 
that does not by itself establish a nevv text chunk (such as a “ispan” element vvithout absolute position adiustments 


due to “x” or ”y” attributes), the “unicode-bidi” property"s value must be embed or bidi-override. 
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Except for any additional information provided in this specification, the normative definition of the “direction” 
property is in CSS2 (İCSS2), section 9.10). 

The “direction” property applies only to glyphs oriented perpendicular to the inline-progression-direction, 
vvhich includes the usual case of horizontally-oriented Latin or Arabic text and the case of narrovv-cell Latin or 
Arabic characters rotated 90 degrees clockvvise relative to a top-to-bottom inline-progression-direction. 


Value: normal 1 embed 1 bidi-override 1 inherit 
lnitial: normal 

Applies to: text content elements 

Inherited: no 

Percentages: N/A 

Media: visual 


Animatable: no 


Except for any additional information provided in this specification, the normative definition of the “unicode-bidi” 
property is in CSS2 (İCSS2), section 9.10). 


10.8 Text rendering order 


"The glyphs associated vvith the characters vvithin a “text” element are rendered in the logical order of the characters 
in the original document, independent of any re-ordering necessary to implement bidirectionality. Thus, for text 
that goes right-to-left visually, the glyphs associated vvith the rightmost character are rendered before the glyphs 
associated vvith the other characters. 

Additionally, each distinct glyph is rendered in its entirety (i.e., it is filled and stroked as specifted by the “fil” 
and “stroke” properties) before the next glyph gets rendered. 


10.9 Alignment properties 


10.9.1 Text alignment properties 


"The “text-anchor” property is used to align (start-, middle- or end-alignment) a string of text relative to a given 
point. 

The “text-anchor” property is applied to each individual text chunk vvithin a given “text” element. Each text 
chunk has an initial current text position, vvhich represents the point in the user coordinate system resulting from 
(depending on context) application of the “x” and “y” attributes on the “text” element, any “x” or ”y” attribute values 
on a “tspan,, “tref” or “altGiyph” element assigned explicitly to the first rendered character in a text chunk, or de- 
termination of the initial current text position for a “textPath” element. 
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Value: start İl middle 1 end 1 inherit 
Initial: start 

Applies to: (text content elements 
inherited: yes 

Percentages: N/A 

Media: visual 


Animatable: yes 
Values have the follovving meanings: 


start 
"The rendered characters are aligned such that the start of the resulting rendered text is at the initial current 
text position. For an element vvith a “direction” property value of "ltr" (typical for most European languages), 
the left side of the text is rendered at the initial text position. For an element vvith a “direction” property value 
of "rtl" (typical for Arabic and Hebrevv), the right side of the text is rendered at the initial text position. For 
an element vvith a vertical primary text direction (often typical for Asian text), the top side of the text is 
rendered at the initial text position. 

middle 
The rendered characters are aligned such that the geometric middle of the resulting rendered text is at the 
initial current text position. 

end 
"The rendered characters are aligned such that the end of the resulting rendered text is at the initial current 
text position. For an element vvith a “direction” property value of "ltr" (typical for most European languages), 
the right side of the text is rendered at the initial text position. For an element vvith a “direction” property 
value of "rtl" (typical for Arabic and Hebrevv), the left side of the text is rendered at the initial text position. 
For an element vvith a vertical primary text direction (often typical for Asian text), the bottom of the text is 
rendered at the initial text position. 


10.9.2 Baseline alignment properties 


An overvievv of baseline alignment and baseline tables can be found above in Fonits, font tables and baselines. 
One of the characteristics of international text is that there are different baselines (different alignment points) 
for glyphs in different seripts. For example, in horizontal vvriting, ideographic seripts, such as Han 1deographs, 
Katakana, Hiragana, and Hangul, alignment occurs vvith a baseline near the bottoms of the glyphs: alphabetic 
based seripts, such as Latin, Cyrillic, Hebrevv, Arabic, align a point that is the bottom of most giyphs, but some 
giyphs descend belovv the baseline, and TIndic based seripts are aligned at a point that is near the top of the giyphs. 
VVhen different seripts are mixed on a line of text, an adiustment must be made to ensure that the gİyphs in 
the different seripts are aligned correctly vvith one another. OpenType TOPENTYPE) fonts have a Baseline table 
(BASE) TOPENTYPE-BASETABLEİ that speciftes the offsets of the alternative baselines from the current baseline. 
SVG uses a similar baseline table model that assumes one script (at one font-size) is the "dominant run" dur- 
ing processing of a “text” element: that is, all other baselines are defined in relation to this dominant run. The 
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baseline of the seript vvith the dominant run is called the dominant baseline. So, for example, if the dominant 
baseline is the alphabetic baseline, there vvill be offsets in the baseline table for the alternate baselines, such as the 
ideographic baseline and the Indic baseline. There vvill also be an offset for the math baseline vvhich is used for 
some math fonts. Note that there are separate baseline tables for horizontal and vertical vvriting-modes. The offsets 
in these tables may be different for horizontal and vertical vvriting. 

The baseline table established at the start of processing of a “text” element is called the dominant baseline 
table. 

Because the value of the “font-family” property is a İist of fonts, to insure a consistent choice of baseline table 
vve define the nominal font in a font list as the first font in the list for vvhich a glyph is available. This is the first 
font that could contain a glyph for each character encountered. (For this definition, glyph data is assumed to be 
present if a font substitution is made or if the font is synthesized.) This definition insures a content independent 
determination of the font and baseline table that is to be used. 

The value of the “font-size” property on the “text” element establishes the dominant baseline table font size. 

The model assumes that each glyph has a "alignment-baseline" value vvhich speciftes the baseline vvith vvhich 
the glyph is to be aligned. (1he "alignment-baseline" is called the "Baseline Tag" in the OpenType baseline table 
description.) The initial value of the “alignment-baseline” property uses the baseline identifter associated vvith the 


"ax" 


given giyph. Alternate values for “alignment-baseline” can be useful for glyphs such as a "“" vvhich are ambiguous 
vvith respect to script membership. 

The model assumes that the font from vvhich the giyph is dravvn also has a baseline table, the font baseline 
table. This baseline table has offsets in units-per-em from the (0,0) point to each of the baselines the font knovvs 
about. In particular, it has the offset from the glyph/s (0,0) point to the baseline identified by the "alignment- 
baseline" 

The offset values in the baseline table are in "design units" vvhich means fractional units of the EM. CSS calls 
these "units-per-em" (İCSS2), section 15.3.4). Thus, the current “font-size” is used to determine the actual offset 
from the dominant baseline to the alternate baselines. 

The giyph is aligned so that its baseline identifted by its "alignment-baseline" is aligned vvith the baseline vvith 
the same name from the dominant baseline table. 

The offset from the dominant baseline of the parent to the baseline identifted by the "alignment-baseline" is 
computed using the dominant baseline table and dominant baseline table font size. The font baseline table and 
font size applicable to the glyph are used to compute the offset from the identifted baseline to the (0,0) point of the 
giyph. This second offset is subtracted from the first offset to get the position of the (0,0) point in the shift direction. 
Both offsets are computed by multiplying the baseline value from the baseline table times the appropriate font size 
value. 

Ifthe "alignment-baseline" identifies the dominant baseline, then the first offset is zero and the giyph is aligned 
vvith the dominant baseline, othervvise, the glyph is aligned vvith the chosen alternate baseline. 

The baseline-identifiers belovv are used in this specification. Some of these are determined by baseline-tables 
contained in a font as described in XSL (fTXSLI, section 7.9.1). Others are computed from other font characteristics 
as described belovv. 


alphabetic 
"This identifies the baseline used by most alphabetic and syllabic scripts. These include, but are not limited to, 
many VVestern, Southern Indic, Southeast Asian (non-ideographic) scripts. 
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ideographic 
"his identifles the baseline used by ideographic scripts. For historical reasons, this baseline is at the bottom 
of the ideographic EM box and not in the center of the ideographic EM box. See the "central" baseline. The 
ideographic scripts include Chinese, lapanese, Korean, and Vietnamese Chu Nom. 

hanging 
"This identifies the baseline used by certain Indic scripts. These scripts include Devanagari, Gurmukhi and 
Bengali. 

mathematical 
"This identiftes the baseline used by mathematical symbols. 

central 
"his identifies a computed baseline that is at the center of the EM box. This baseline lies halfvvay betvveen 
the text-before-edge and text-after-edge baselines. 


NOTE: 
For ideographic fonts, this baseline is often used to align the glyphs: it is an alternative to the 
ideographic baseline. 


middle 
"This identiftes a baseline that is offset from the alphabetic baseline in the shift-direction by 1/2 the value of 
the x-height font characteristic. The position of this baseline may be obtained from the font data or, for fonts 
that have a font characteristic for "x-height", it may be computed using 1/2 the "x-height". Lacking either of 
these pieces of information, the position of this baseline may be approximated by the "central" baseline. 
text-before-edge 
"This identiftes the before-edge of the EM box. The position of this baseline may be specifted in the baseline- 
table or it may be caleculated. 


NOTE: 

The position of this baseline is normally around or at the top of the ascenders, but it may not 
encompass all accents that can appear above a gİyph. For these fonts the value of the "ascent" 
font characteristic is used. For ideographic fonts, the position of this baseline is normally 1 EM 
in the shift-direction from the "ideographic" baseline. Hovvever, some ideographic fonts have 
a reduced vvidth in the inline-progression-direction to allovv tighter setting. VVhen such a font, 
designed only for vertical vvriting-modes, is used in a horizontal vvriting-mode, the "text-before- 
edge" baseline may be less than 1 EM from the text-after-edge. 


text-after-edge 
"This identiftes the after-edge of the EM box. The position of this baseline may be specifted in the baseline- 
table or it may be calculated. 


NOTE: 

For fonts vvith descenders, the position of this baseline is normally around or at the bottom of the 
descenders. For these fonts the value of the "descent" font characteristic is used. For ideographic 
fonts, the position of this baseline is normally at the "ideographic" baseline. 
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"There are, in addition, tvvo computed baselines that are only defined for line areas. Since SVG does not support the 
notion of computations based on line areas, the tvvo computed baselines are mapped as follovvs: 


before-edge 

For SVG, this is equivalent to text-before-edge. 
after-edge 

For SVG, this is equivalent to text-after-edge. 


"There are also four baselines that are defined only for horizontal vrriting-modes. 


top 
"This baseline is the same as the "before-edge" baseline in a horizontal vvriting-mode and is undefined in a 
vertical vvriting mode. 

text-top 
"his baseline is the same as the "text-before-edge" baseline in a horizontal vvriting-mode and is undefined in 
a vertical vvriting mode. 

bottom 
"his baseline is the same as the "after-edge" baseline in a horizontal vvriting-mode and is undefined in a ver- 
tical vrriting mode. 

text-bottom 
"This baseline is the same as the "text-after-edge" baseline in a horizontal vvriting-mode and is undefined in a 


vertical vvriting mode. 


"The baseline-alignment properties follovv. 


auto İ use-script İ no-change 1 reset-size 1 ideographic 1 alphabetic 1 hanging 1 mathematical 1 


yalı central I middle 1 text-after-edge 1 text-before-edge 1 inherit 
Initial: auto 

Applies to: (text content elements 

Inherited: no 

Percentages: N/A 

Media: visual 


Animatable: yes 


The "dominant-baseline" property is used to determine or re-determine a scaled-baseline-table. A scaled-baseline- 
table is a compound value vvith three componenits: a baseline-identifter for the dominant-baseline, a baseline-table 
and a baseline-table font-size. Some values of the property re-determine all three values: other only re-establish 
the baseline-table font-size. VVhen the initial value, auto, vvould give an undesired result, this property can be used 
to explicitly set the desire scaled-baseline-table. 

Values for the property have the follovving meaning: 
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auto 
If this property occurs on a “text” element, then the computed value depends on the value of the “vriting- 
mode” property. If the "vriting-mode" is horizontal, then the value of the dominant-baseline component is 
"alphabetic,, else if the “vriting-mode is vertical, then the value of the dominant-baseline component is "cent- 
ral, 

If this property occurs on a “tspan”, “tref”, “altGlyph” or “textPath” element, then the dominant-baseline 
and the baseline-table components remain the same as those of the parent text content element. If the com- 
puted “baseline-shift” value actually shifts the baseline, then the baseline-table font-size component is set to 
the value of the “font-size” property on the element on vvhich the “dominant-baseline” property occurs, other- 
vvise the baseline-table font-size remains the same as that of the element. If there is no parent text content 
element, the scaled-baseline-table value is constructed as above for “text” elements. 

use-script 
The dominant-baseline and the baseline-table components are set by determining the predominant script of 
the character data content. The “vrriting-mode”, vvhether horizontal or vertical, is used to select the appro- 
priate set of baseline-tables and the dominant baseline is used to select the baseline-table that corresponds 
to that baseline. The baseline-table font-size component is set to the value of the “font-size” property on the 
element on vvhich the “dominant-baseline” property occurs. 

no-change 
The dominant-baseline, the baseline-table, and the baseline-table font-size remain the same as that of the 
parent text content element. 

reset-size 
"The dominant-baseline and the baseline-table remain the same, but the baseline-table font-size is changed 
to the value of the “font-size” property on this element. "This re-scales the baseline-table for the current “font- 
size”. 

ideographic 
"The baseline-identifter for the dominant-baseline is set to be "deographic" the derived baseline-table is con- 
structed using the ideographic" baseline-table in the nominal font, and the baseline-table font-size is changed 
to the value of the “font-size” property on this element. 

alphabetic 
"The baseline-identifter for the dominant-baseline is set to be "alphabetic, the derived baseline-table is con- 
structed using the "alphabetic" baseline-table in the nominal font, and the baseline-table font-size is changed 
to the value of the “font-size” property on this element. 

hanging 
"The baseline-identifter for the dominant-baseline is set to be "hanging, the derived baseline-table is construc- 
ted using the "hanging/ baseline-table in the nominal font, and the baseline-table font-size is changed to the 
value of the “font-size” property on this element. 

mathematical 
The baseline-identifter for the dominant-baseline is set to be "mathematical", the derived baseline-table is 
constructed using the "mathematical" baseline-table in the nominal font, and the baseline-table font-size is 
changed to the value of the “font-size” property on this element. 

central 
"The baseline-identifter for the dominant-baseline is set to be "central" "The derived baseline-table is construc- 


ted from the defined baselines in a baseline-table in the nominal font. That font baseline-table is chosen using 
the follovving priority order of baseline-table names: "ideographic, "alphabetic, "hanging) "mathematical". The 
baseline-table font-size is changed to the value of the “font-size” property on this element. 
middle 

"The baseline-identifter for the dominant-baseline is set to be "middle. The derived baseline-table is construc- 
ted from the defined baselines in a baseline-table in the nominal font. That font baseline -table is chosen 
using the follovving priority order of baseline-table names: "alphabetic", "ideographic, "hanging) "mathemat- 
ical" The baseline-table font-size is changed to the value of the “font-size” property on this element. 
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text-after-edge 
"The baseline-identifter for the dominant-baseline is set to be "text-after-edge". The derived baseline-table is 
constructed from the defined baselines in a baseline-table in the nominal font. The choice of vvhich font 
baseline-table to use from the baseline-tables in the nominal font is implementation defined. The baseline- 
table font-size is changed to the value of the “font-size” property on this element. 





NOTE: using the follovring priority order of baseline-table names: "alphabetic, "deographic, "hanging, 

"mathematical" is probably a reasonable strategy for determining vvhich font baseline-table to use. 
text-before-edge 

The baseline-identifter for the dominant-baseline is set to be "text-before-edge" The derived baseline-table is 

constructed from the defined baselines in a baseline-table in the nominal font. The choice of vvhich baseline- 

table to use from the baseline-tables in the nominal font is implementation defined. The baseline-table font- 

size is changed to the value of the “font-size” property on this element. 


NOTE: Using the follovving priority order of baseline-table names: "alphabetic, "ideographic, "hanging, 
"mathematical" is probably a reasonable strategy for determining vvhich font baseline-table to use. 


If there is no baseline table in the nominal font or if the baseline table lacks an entry for the desired baseline, then 
the user agent may use heuristics to determine the position of the desired baseline. 


alp: auto 1 baseline 1 before-edge 1 text-before-edge 1 middle 1 central 1 after-edge 1 text-after-edge 1 
ı ideographic 1 alphabetic 1 hanging I mathematical 1 inherit 
lnitial: auto 


Applies to: “ispan”, “tref”, “altGiyph”, “extPath” elements 


Inherited: no 
Percentages: N/A 
Media: visual 


Animatable: yes 


"This property specifies hovv an obiect is aligned vvith respect to its parent. This property specifies vvhich baseline 
of this element is to be aligned vvith the corresponding baseline of the parent. For example, this allovvs alphabetic 
baselines in Roman text to stay aligned across font size changes. It defaults to the baseline vvith the same name 
as the computed value of the alignment-baseline property. That is, the position of "ideographic" alignment-point 
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in the block-progression-direction is the position of the "ideographic" baseline in the baseline-table of the obiect 
being aligned. 
Values have the follovving meanings: 


auto 
"The value is the dominant-baseline of the seript to vvhich the character belongs - i.e., use the dominant- 
baseline of the parent. 

baseline 
"The alignment-point of the obyect being aligned is aligned vvith the dominant-baseline of the parent text 
content element. 

before-edge 
"The alignment-point of the obyect being aligned is aligned vvith the "before-edge" baseline of the parent text 
content element. 

text-before-edge 
"The alignment-point of the obyect being aligned is aligned vvith the "text-before-edge" baseline of the parent 
text content element. 

middle 
"The alignment-point of the obfect being aligned is aligned vvith the "middle" baseline of the parent text con- 
tent element. 

central 
"The alignment-point of the obfect being aligned is aligned vvith the "central" baseline of the parent text con- 
tent element. 

after-edge 
"The alignment-point of the obyect being aligned is aligned vvith the "after-edge" baseline of the parent text 
content element. 

text-after-edge 
"The alignment-point of the obyect being aligned is aligned vvith the "text-after-edge" baseline of the parent 
text content element. 

ideographic 
"The alignment-point of the obiect being aligned is aligned vvith the "ideographic" baseline of the parent text 
content element. 

alphabetic 
"The alignment-point of the obiect being aligned is aligned vvith the "alphabetic" baseline of the parent text 
content element. 

hanging 
"The alignment-point of the obfect being aligned is aligned vvith the "hanging" baseline of the parent text 
content element. 

mathematical 
The alignment-point of the obyect being aligned is aligned vvith the "mathematical" baseline of the parent 
text content element. 


c 
.Ə 
5 
İv) 
m") 
cc 
(3) 
z 
E 
ə) 
(ə) 
o 
ad 
. 
- 





Value: baseline I sub İ super l -percentages 1 -length” 1 inherit 
Initial: baseline 
Applies to: “ispan”, “tref”, “altGiyph”, “extPath” elements 
Inherited: no 

refers to the "line-height" of the “text” element, vvhich in the case of SVG is defined to be equal to 
Percentages: . 
the “font-size” 
Media: visual 
Animatable: yes 


"The “baseline-shift” property allovvs repositioning of the dominant-baseline relative to the dominant-baseline of the 
parent text content element. The shifted obiect might be a sub- or superscript. VVithin the shifted obfect, the vvhole 
baseline-table is offset, not fust a single baseline. The amount of the shift is determined from information from 
the parent text content element, the sub- or superscript offset from the nominal font of the parent text content 
element, percent of the "line-height" of the parent text content element or an absolute value. 

In SVG, the "baseline-shifb” property represents a supplemental adiustment to the baseline tables. The “baseline- 
shift” property shifts the baseline tables for each gİyph to temporary nevv positions, for example to lift the glyph 
into superseript or subseript position, but it does not effect the current text position. VVhen the current text pos- 
ition is adiusted after rendering a gİyph to take into account glyph advance values, the adiustment happens as if 
there vvere no baseline shift. 

“baseline-shift” properties can nest. Each nested "baseline-shift” is added to previous baseline shift values. 


Values for the property have the follovving meaning: 


baseline 
"There is no baseline shift, the dominant-baseline remains in its original position. 

sub 
"The dominant-baseline is shifted to the default position for subscripts. The offset to this position is determ- 
ined using the font data for the nominal font. Because in most fonts the subseript position is normally given 
relative to the "alphabetic" baseline, the user agent may compute the effective position for subscripts for su- 
perseripts vvhen some other baseline is dominant. The suggested computation is to subtract the difference 
betvveen the position of the dominant baseline and the position of the "alphabetic" baseline from the pos- 
ition of the subscript. The resulting offset is determined by multiplying the effective subseript position by 
the dominant baseline-table font-size. If there is no applicable font data the user agent may use heuristics to 
determine the offset. 

super 
"The dominant-baseline is shifted to the default position for superscripts. The offset to this position is determ- 
ined using the font data for the nominal font. Because in most fonts the superseript position is normally 
given relative to the "alphabetic" baseline, the user agent may compute the effective position for superscripts 
vvhen some other baseline is dominant. The suggested computation is to subtract the difference betvveen the 
position of the dominant baseline and the position of the "alphabetic" baseline from the position of the super- 
script. The resulting offset is determined by multiplying the effective superscript position by the dominant 
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baseline-table font-size. If there is no applicable font data the user agent may use heuristics to determine the 
offset, 

xpercentage” 
"The computed value of the property is this percentage multiplied by the computed "line-height" of the “text” 
element. The dominant-baseline is shifted in the shift direction (positive value) or opposite to the shift direc- 
tion (negative value) of the parent text content element by the computed value. A value of "077" is equivalent 
to "baseline", 

elength” 
The dominant-baseline is shifted in the shift direction (positive value) or opposite to the shift direction (neg- 
ative value) of the parent text content element by the -length” value. A value of "0cm" is equivalent to 


"baseline"., 


10.10 Font selection properties 


SVG uses the follovving font specification properties. Except for any additional information provided in this spe- 
cification, the normative definition of these properties is in CSS2 (TCSS2), chapter section 15.2). Any SVG-specific 
notes about these properties are contained in the descriptions belovv. 

Note also the rules for expressing the syntax of CSS property values (TCSS2), section 1.3.2). 


İl -family-names 1 


Value: cgeneric-familyə 11” Efamily-names- 1 
xgeneric-family”1 İ inherit 
lnitial: depends on user agent 


Applies to: text content elements 
Inherited: yes 

Percentages: N/A 

Media: visual 

Animatable: yes 


"This property indicates vvhich font family is to be used to render the text, specifted as a prioritized list of font fam- 
ily names and/or generic family names. Unless the family name corresponds to a CSS TDENT, it must be quoted. 
Except for any additional information provided in this specification, the normative definition of the property is in 
CSS2 (İCSS2), section 15.2.2). 
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Value: normal 1 italic 1 oblique 1 inherit 
Initial: normal 

Applies to: (text content elements 
İnherited: yes 

Percentages: N/A 

Media: visual 


Animatable: yes 


"This property specifies vvhether the text is to be rendered using a normal, italic or oblique face. Except for any 
additional information provided in this specification, the normative definition of the property is in CSS2 (TCSS2İ, 
section 15.2.3). 


Value: normal 1 small-caps 1 inherit 





Initial: normal 

Applies to: (text content elements 
inherited: yes 

Percentages: N/A 

Media: visual 

Animatable: yes 


"This property indicates vvhether the text is to be rendered using the normal glyphs for lovvercase characters or 
using small-caps glyphs for lovvercase characters. Except for any additional information provided in this specific- 
ation, the normative definition of the property is in CSS2 (TCSS2), section 15.2.3). 


normal 1 bold 1 bolder 1 lighter 1 100 1 200 1 300 


Value: : : 
İ 400 1 500 1 600 1 700 1 800 1 900 1 inherit 

lnitial: normal 

Applies to: (text content elements 

inherited: yes 

Percentages: N/A 

Media: visual 


Animatable: yes 


"This property refers to the boldness or lightness of the glyphs used to render the text, relative to other fonts in the 
same font family. Except for any additional information provided in this specification, the normative definition of 
the property is in CSS2 (TCSS2l, section 15.2.3). 


Value: normal 1 vvider 1 narrovver 1 
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ultra-condensed 1 extra-condensed İ 
condensed l semi-condensed 1 
semi-expanded 1 expanded İl 
extra-expanded 1 ultra-expanded 1 inherit 


lnitial: normal 

Applies to: text content elements 
inherited: yes 

Percentages: N/A 

Media: visual 


Animatable: yes 


"This property indicates the desired amount of condensing or expansion in the glyphs used to render the text. Ex- 
cept for any additional information provided in this specification, the normative definition of the property is in 
CSS2 (İCSS2), section 15.2.3). 


xabsolute-sizes- 1 crelative-sizeə 1 


Value: : : 
clengthə- / cpercentages İ inherit 

lnitial: medium 

Applies to: text content elements 

Inherited: yes, the computed value is inherited 

Percentages: refer to parent elements font size 

Media: visual 


Animatable: yes 


"This property refers to the size of the font from baseline to baseline vvhen multiple lines of text are set solid in 
a multiline layout environment. For SVG, if a -length” is provided vvithout a unit identifter (e.g., an unqualifted 
number such as 128), the SVG user agent processes the -lengths- as a height value in the current user coordinate 
system. 

If a -lengths is provided vvith one of the unit identiflers (e.g., 12pt or 1072), then the SVG user agent converts 
the -lengih” into a corresponding value in the current user coordinate system by applying the rules described in 
Units. 

Except for any additional information provided in this specification, the normative definition of the property 
is in CSS2 (İCSSZ2), section 15.2.4). 
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Value: cnumber: 1 none 1 inherit 
lnitial: none 

Applies to: (text content elements 
İnherited: yes 

Percentages: N/A 

Media: visual 


Animatable: yes (non-additive) 


"This property allovvs authors to specify an aspect value for an element that vvill preserve the x-height of the first 
choice font in a substitute font. Except for any additional information provided in this specification, the normative 
definition of the property is in CSS2 (İCSS2), section 15.2.4). 


“font” 
İ1--font-siyle”. İl —font-variant”. İl “font-vveight” 1? 
cfont-size”. İ/ cline-heights 1? font-family” 11 


Value: : : 
caption İ icon l menu l message-box İl 
small-caption İ status-bar 1 inherit 
Initial: see individual properties 
Applies to: (text content elements 
inherited: yes 
allovved on "font-size" and "ine-height" (Note: for the purposes of processing the “font” property in 
Percentages: 


SVG, fine-height" is assumed to be equal the value for property “font-size”) 
Media: visual 
Animatable: yes (non-additive) 


Shorthand property for setting “font-style”, “font-variant”, Tont-vveight”, “font-size”, "İine-height” and “font-family”. 
"The “line-height” property has no effect on text layout in SVG. For the purposes of the “font” property, “line-height” 
is assumed to be equal to the value of the “font-size” property. Conforming SVG Vievvers are not required to sup- 
port the various system font options (caption, icon, menu, message-box, small-caption and status-bar) and can use 
a system font or one of the generic fonts instead. 

Except for any additional information provided in this specification, the normative definition of the property 
is in CSS2 (TCSS2)l, section 15.2.5). 


10.11 Spacing properties 


"Three properties affect the space betvveen characters and vvords: 


e “kerning” indicates vvhether the user agent should adfust inter-giyph spacing based on kerning tables that are 
included in the relevant font (i.e., enable auto-kerning) or instead disable auto-kerning and instead set inter- 


character spacing to a specific length (typically, zero). 


c 
.o 
5 
İv) 
m") 
(s 
(3) 
E 
E 
ə) 
(ə) 
o 
ad 
. 
s 





e “Tetter-spacing” indicates an amount of space that is to be added betvveen text characters supplemental to any 
spacing due to the “kerning” property. 
e “vrord-spacing” indicates the spacing behavior betvveen vvords. 


Value: auto İ -lengths- 1 inherit 
lnitial: auto 

Applies to: (text content elements 
Inherited: yes 

Percentages: N/A 

Media: visual 


Animatable: yes 


"The value of auto indicates that the user agent should adfust inter-giyph spacing based on kerning tables that are 
included in the font that vvill be used (i.e., enable auto-kerning). 

If a -lengihs is provided, then auto-kerning is disabled. Instead, inter-character spacing is set to the given 
elengths. The most common scenario, other than auto, is to set “kerning” to a value of 0 so that auto-kerning is 
disabled. 

If a -lengih” is provided vvithout a unit identifter (e.g., an unqualified number such as 128), the SVG user 
agent processes the -lengths as a vvidth value in the current user coordinate system. 

If a -length” is provided vvith one of the unit identifters (e.g., .25em or 172), then the SVG user agent converts 
the -lengih” into a corresponding value in the current user coordinate system by applying the rules deseribed in 
Units. 

VVhen a -length:”- is provided, its value is added to the inter-character spacing value specified by the 1etter- 


spacing” property. 


Value: normal 1 -length”- 1 inherit 
Initial: normal 

Applies to: (text content elements 
inherited: yes 

Percentages: N/A 

Media: visual 


Animatable: yes 


"This property speciftes spacing behavior betvveen text characters supplemental to any spacing due to the “kerning” 
property. 

For SVG, if a -length” is provided vvithout a unit identifter (e.g., an unqualified number such as 128), the SVG 
user agent processes the -lengths as a vvidth value in the current user coordinate system. 

If a -length” is provided vvith one of the unit identifters (e.g., .25em or 172), then the SVG user agent converts 
the -lengih” into a corresponding value in the current user coordinate system by applying the rules described in 
Units. 
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Except for any additional information provided in this specification, the normative definition of the property 
is in CSS2 (İCSS2l, section 16.4). 


Value: normal 1 -length”- 1 inherit 
Initial: normal 

Applies to: (text content elements 
inherited: yes 

Percentages: N/A 

Media: visual 


Animatable: yes 


"This property speciftes spacing behavior betvveen vvords. For SVG, if a -length”- is provided vvithout a unit identifter 
(e.g., an unqualified number such as 128), the SVG user agent processes the -length” as a vvidth value in the current 
user coordinate system. 

If a dlength” is provided vvith one of the unit identifters (e.g., .25em or 172), then the SVG user agent converts 
the -length” into a corresponding value in the current user coordinate system by applying the rules described in 
Units. 

Except for any additional information provided in this specification, the normative definition of the property 
is in CSS2 (İCSS2)l, section 16.4). 


10.12 Text decoration 


Value: none 1 Tunderline İl overline İl line-through İl blink 11 inherit 
lnitial: none 

Applies to: (text content elements 

inherited: no (see prose) 

Percentages: N/A 

Media: visual 


Animatable: yes 


"This property describes decorations that are added to the text of an element. Conforming SVG Vievvers are not 
required to support the blink value. 

Except for any additional information provided in this specification, the normative definition of the property 
is in CSS2 (TCSS2)l, section 16.3.1). 

The CS52 specification defines the behavior of the “text-decoration” property using the terminology "block- 
level elements" and "inline elements". For the purposes of the “text-decoration” property and SVG, a “text” element 
represents a block-level element and any of the potential children of a “text” element (e.g., a “tspan”) represent inline 
elements. 

Also, the CSS2 definition of “text-decoration” speciftes that the "color of the decorations" remain the same on 
descendant elements. Since SVG offers a painting model consisting of the ability to apply various types of paint 
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(see Painting: Filling, Stroking and Marker Symbols) to both the interior (i.e., the "fll") and the outline (1.e., the 
"stroke") of text, for SVG the “text-decoration” property is defined such that, for an element vvhich has a specified 
value for the “text-decoration” property, all decorations on its content and that of its descendants are rendered using 
the same fill and stroke properties as are present on the given element. If the “text-decoration” property is specified 
on a descendant, then that overrides the ancestor. 


Because SVG allovvs text to be both filled and stroked, dravving order matters in some circumstances vvith 
text decorations. Text decoration dravving order should be as follovvs: 


e Aİl text decorations except line-through should be dravvn before the text is filled and stroked: thus, the text 
is rendered on top of these decorations. 


e Line-through should be dravvn after the text is filled and stroked: thus, the line-through is rendered on top of 
the text. 


Example textdecoration01 provides examples for “text-decoration”. The first line of text has no value for “text-dec- 
oration”, so the initial value of text-decoration:none is used. The second line shovvs text-decoration:line-through. The 
third line shovvs text-decoration:underline. The fourth line illustrates the rule vvhereby decorations are rendered 
using the same fill and stroke properties as are present on the element for vvhich the “text-decoration” is specifted. 
Since “text-decoration” is specified on the “text” element, all text vvithin the “text” element has its underline rendered 
vvith the same fill and stroke properties as exist on the “text” element (i.e., blue fill, red stroke), even though the 
various vvords have different fill and stroke property values. Hovvever, the vvord "different" explicitly speciftes a 
value for “text-decoration”, thus, its underline is rendered using the fill and stroke properties as the “tspan” element 
that surrounds the vvord "different" (1.e., yellovv fill, darkgreen stroke): 


c?xml versionz"1.0" standalonez"no"?z 
x DOCTYPE svg PUBLİC "-//V/3C/ /DTD SVG 1.1//EN" 
"http: / /vuv/ .vV3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
€Ssvg vidthe"12cm" height-"4cm" vievBoxz"0 0 1200 400" 
xmlnse"http: / /uvv .vV3.o0rg/2000/svg" versionze"1.1"5 
edescsExample textdecoration01 - behavior of "text-decoration" property-c/desc” 
crect xe"1" ye"1" vidth-"1198" height-"398" fill-"none" strokeze"blue" stroke-vidthe"2" /s 
sg font-sizez"60" fill-"blue" strokee"red" stroke-vidthe"1" s 
etext xe"100" ye"75"-Normal text-c/texte 
etext xz"100" y-"165" text-decoration-"line-through" sText vith line-through-/text- 
etext xz"100" y-"255" text-decoration-"underline" sUnderlined textc/text- 
etext xe"100" ye-"345" text-decoration-"underline" x 
s€tspansüne -/tspanx- 
etspan fill-"yellov" strokez"purple" svord -c/tspans 
etspan fill-"yellov" strokez"black" shas -/tspanx 
etspan fill-"yellov" strokez"darkgreen" text-decoration-"underline" sdifferent -/tspanx 
etspan fill-"yellov" strokez"blue" sunderlining-/tspanx- 
c/ text 
x/g” 
c/ svg” 
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Example textdecoration01 


Normal text 











10.13 Text on a path 


10.13.1 Introduction to text on a path 


mn addition to text dravvn in a straight line, SVG also includes the ability to place text along the shape of a “path” 
element. To specify that a block of text is to be rendered along the shape of a Tath”, include the given text vvithin 
a “textPath” element vvhich includes an “xlink:href” attribute vvith an IRI reference to a “path” element. 


10.13.2 The “textPath” element 


Categories: “textPath” 
"Text content element, text content child element 


Content model: 
Any number of the follovving elements, in any order: 
descriptive elements 
.” 
“altGiyph” 
“animate” 
“animateColor” 
“set” 
“tref” 


“tspan” 


Attributes: 
conditional processing attributes 
core attributes 
graphical event attributes 
presentation attributes 
xlink attributes 


“class” 

“style” 
“externalResourcesRequired” 
“xlink:href” 

“startOffset” 


“method” 
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“spacing” 


DOM Tnterfaces: 
SVGTextPathElement 


Attribute definitions: 





startOffset — "-length-" 
An offset from the start of the “path” for the initial current text position, calculated using the user agent"s 
distance along the path algorithm. 
If a -length: other than a percentage is given, then the “startOffset” represents a distance along the path 
measured in the current user coordinate system. 
If a percentage is given, then the “startOffset” represents a percentage distance along the entire path. Thus, 
startOffset-"072" indicates the start point of the “path” and startOffset-"10072" indicates the end point of the 
“path”. 


If the attribute is not specifted, the effect is as if a value of "0" vvere specifted. 
Animatable: yes. 


method - "align İl stretch" 
Indicates the method by vvhich text should be rendered along the path. 
A value of align indicates that the glyphs should be rendered using simple 2x3 transformations such that 
there is no stretching/vvarping of the glyphs. Typically, supplemental rotation, scaling and translation trans- 
formations are done for each glyph to be rendered., As a result, vvith align, fonts vvhere the glyphs are de- 
signed to be connected (e.g., cursive fonts), the connections may not align properly vvhen text is rendered 
along a path. 
A value of stretch indicates that the glyph outlines vvill be converted into paths, and then all end points and 
control points vvill be adiusted to be along the perpendicular vectors from the path, thereby stretching and 
possibly vvarping the glyphs. VVith this approach, connected glyphs, such as in cursive scripts, vvill maintain 
their connections. 
If the attribute is not specifted, the effect is as if a value of align vvere specifted. 
Animatable: yes. 


spacing — "auto İ exact" 
Indicates hovv the user agent should determine the spacing betvveen gİyphs that are to be rendered along a 


path. 

A value of exact indicates that the giyphs should be rendered exactly according to the spacing rules as spe- 
cifled in Text on a path layout rules. 

A value of auto indicates that the user agent should use text-on-a-path layout algorithms to adfust the spa- 
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cing betvveen gİyphs in order to achieve visually appealing resulits. 
If the attribute is not specifted, the effect is as if a value of exact vvere specifled. 
Animatable: yes. 


xlink:href - "-iri-" 
An TRI reference to the “path” element onto vvhich the giyphs vvill be rendered. İf -iri- is an invalid reference 
(e.g., no such element exists, or the referenced element is not a “path”), then the “textPath” element is in error 
and its entire contents shall not be rendered by the user agent. 
Animatable: yes. 





"The path data coordinates vvithin the referenced “path” element are assumed to be in the same coordinate system 
as the current “text” element, not in the coordinate system vvhere the “path” element is defined. The “transform” 
attribute on the referenced “pat” element represents a supplemental transformation relative to the current user 
coordinate system for the current “text” element, including any adiustments to the current user coordinate system 
due to a possible “transform” attribute on the current “text” element. For example, the follovving fragment of SVG 


content: 


xsvg xmlnse"http: / /vvv.v/3.0T9/2000/svg" 
xmlns:xlinke"http://uv.v3.org/1999/xlink" versionze"1.1"5 
€g transform-"translate(25,25)"- 
xdefsəs 
vpath id-"pathl" transform-"scale(2)" de"..." fill-"none" strokez"red"/” 
e/deTfsə” 
x/gz 
etext transform-"rotate(45)"s 
etextPath xlink:hrefze"öpathli"sText along pathl1-/textPath- 
ce/text- 
x/ svg” 


should have the same effect as the follovving: 


xsvg xmlnsze"http: / /vvv .v/3.0T9/2000/svg" 
xmlns:xlinke"http://uv.v3.org/1999/xlink" versionze"1.1"5 
€g transform-"rotate(45)"- 
xdefss 
c€path ide"pathl" transform-"scale(2)" de"..." fill-"none" strokez"red"/” 
x/deTsəs 
etextə” 
etextPath xlink:hrefz"Zpathli"sText along path1-/textPath- 
c/text” 
x/gz 
c/ svg” 


Note that the transform-"translate(25,25)" has no effect on the “textPath” element, vvhereas the trans- 
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form" rotate(45)" applies to both the “text” and the use of the “path” element as the referenced shape for text on 
a path. 
Example toap61 provides a simple example of text on a path: 


c?xml versionz"1.0" standalone-"no"?z 
€ DOCTYPE svg PUBLİC "-//V3C//DTD SVG 1.1//EN" 
"http: / /vvv/.v/3.org/Graphics/SVG/1.1/DTD/svg11.dtd"s 
x€svg vidth-"12cm" height-"3.6cm" vievBox-"0 0 1000 300" version-"1.1" 
xmlnsz"http: / /vuvv .vV3.0T9/2000/svg" xmlns:xlinke"http:/ /vuv.v3.org/1999/xlink"s 
edefso” 
cpath id-"MyPath" 
d-"M 100 200 
C 200 100 300 0 400 100 
C 500 200 600 300 700 200 
C 800 100 900 100 900 100" /5 
s/defss 
cdescsExample toap01 - simple text on a path-/desc- 


cuse xlink:href-"öMyPath" fill-"none" strokez"red" /z 
etext font-family-"Verdana" font-sizez"42.5" fill-"blue" x 
etextPath xlink:href-"ZMyPath"x 
Me gö up, then ve go doövn, then up again 
ce/textPath- 
c/text- 


c1-- Shov outline of canvas using "rect" element --x 
crect xe"1" y-"1" vidth-"998" height-"298" 
fill-"none" strokez"blue" stroke-vidthe"2" /s 
x/ svg” 


Example toap01 











Example toap02 shovvs hovv “tspan” elements can be included vvithin “textPath” elements to adiust styling attributes 
and adiust the current text position before rendering a particular giyph. The first occurrence of the vvord "up" is 
filled vvith the color red. Attribute “dy” is used to lift the vvord "up" from the baseline. 


c?xml versionz"1.0" standalone-"no"?z 
€ DOCTYPE svg PUBLİC "-//V3C//DTD SVG 1.1//EN" 
"http: / /Muv .v3..org/Graphics/SVG/1.1/DTD/svg11.dtd"x 
s€svg vidth-"12cm" height-"3.6cm" vievBoxz-"0 0 1000 300" versione"1.1" 
xmlnse"http: / /uvv .vV3.0rg/2000/svg" xmlns:xlinke"http://vuv.v3.0rg/1999/xl1ink"s 
edefsəs 
cpath id-"MyPath" 
d-"M 100 200 
C 200 100 300 0 400 100 
C 500 200 600 300 700 200 
C 800 100 900 100 900 100" /5 
s/defss 
cdescsExample toap02 - tspan vithin textPath-/desc” 


cuse xlink:href-"öMyPath" fill-"none" strokez"red" /” 
etext font-family-"Verdana" font-sizez"42.5" fill-"blue" 5 
etextPath xlink:href-"ZMyPath"x 
Ve go 
c€tspan dyz"-30" fill-"red" s 
up 
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c/tspan” 
e€tspan dyz"30"x5 


c/tspanx 
then ve go dovmn, then up again 
c/textPath- 
s/text- 


c1-- Shov outline of canvas using "rect" element --5 
crect xe"1" y-"1" vidth-"998" height-"298" 
fill-"none" stroke-"blue" stroke-vidthe"2" /s 
x/ svg” 


Example toap02 





ov ei 








Example toap03 demonstrates the use of the “startOffset” attribute on the “textPath” element to specify the start po- 
sition of the text string as a particular position along the path. Notice that giyphs that fall off the end of the path 
are not rendered (see text on a path layout rules). 


c?xml versionz"1.0" standalone-"no"?x 
€ DOCTYPE svg PUBLİC "-//V3C//DTD SVG 1.1//EN" 
"http: / /vvv/.vV3.org/Graphics/SVG/1.1/DTD/svg11.dtd"s 
x€svg vidth-"12cm" height-"3.6cm" vievBox-"0 0 1000 300" version-"1.1" 
xmlnsz"http: / /vuv/ .v(3.0T9/2000/svg" xmlns:xlinke"http:/ /vuv.v3.org/1999/xlink"s 
edefss 
cpath id-"MyPath" 
d-"M 100 200 
C 200 100 300 0 400 100 
C 500 200 600 300 700 200 
C 800 100 900 100 900 100" /5 
xe/defss 
cdescsExample toap03 - text on a path vith startOffset attribute-c/desc” 


cuse xlink:href-"HMyPath" fill-"none" strokez"red" /” 
etext font-family-"Verdana" font-sizez"42.5" fill-"blue" x 
etextPath xlink:href-"ZMyPath" startOffset-"808"5 
he gö up, then ve go doövn, then up again 
e/textPath- 
ce/text- 


c1-- Shov outline of canvas using "rect" element --5 
crect xe"1" y-"1" vidth-"998" height-"298" 
fill-"none" stroke-"blue" stroke-vidth-"2" /s 
x/svg” 
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Example toap03 














10.13.3 Text on a path layout rules 


Conceptually, for text on a path the target path is stretched out into either a horizontal or vertical straight line 
segment. For horizontal text layout flovvs, the path is stretched out into a hypothetical horizontal line segment 
such that the start of the path is mapped to the left of the line segment. For vertical text layout flovvs, the path is 
stretched out into a hypothetical vertical line segment such that the start of the path is mapped to the top of the 
line segment. The standard text layout rules are applied to the hypothetical straight line segment and the result is 
mapped back onto the target path. Vertical and bidirectional text layout rules also apply to text on a path. 

The reference orientation is determined individually for each giyph that is rendered along the path. For ho- 
rizontal text layout flovvs, the reference orientation for a given gİyph is the vector that starts at the intersection 
point on the path to vvhich the glyph is attached and vvhich points in the direction 90 degrees counter-clockvvise 
from the angle of the curve at the intersection point. For vertical text layout flovvs, the reference orientation for a 
given glyph is the vector that starts at the intersection point on the path to vvhich the glyph is attached and vvhich 
points in the direction 180 degrees from the angle of the curve at the intersection point. 

Example toap04 vvill be used to illustrate the particular layout rules for text on a path that supplement the 
basic text layout rules for straight line horizontal or vertical text. 


c?xml versionz"1.0" standalone-"no"?z 
xc DOCTYPE svg PUBLİC "-//V/3C/ /DTD SVG 1.1//EN" 
"http: / /vuv/.vV3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
s€svg vidth-"12cm" height-"3.6cm" vievBoxz"0 0 1000 300" versionz"1.1" 
xmlnsz"http: / /vuuv/ .v/3..0T9/2000/svg" xmlns:xlinke"http:/ /vvv.v3.org/1999/xl1ink"s 


edefss 
cpath id-"MyPath" 
de"M 100 125 
C 150 125 250 175 300 175 
C 350 175 450 125 500 125 
C 550 125 650 175 700 175 
C 750 175 850 125 900 125" /5 
e/defs- 


edescsExample toap04 - text on a path layout rules-/desc- 


cuse xlink:href-"HMyPath" fill-"none" strokez"red" /” 
etext font-family-"Verdana" font-sizez"60" fill-"blue" letter-spacingz"2" x 
etextPath xlink:href-"ZMyPath"x 
Choose shame or get var 
ce/textPath- 
e/text- 


c1-- Shov outline of canvas using "rect" element --x 
crect xe"1" ye"1" vidth-"998" height-"298" 
fill-"none" strokez"blue" stroke-vidthe"2" /s 
s/ svg” 
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Example toap04 














The follovving picture does an initial zoom in on the first giyph in the “text” element. 





.. 


"The small dot above shovvs the point at vvhich the glyph is attached to the path. The box around the giyph shovvs 
the glyph is rotated such that its horizontal axis is parallel to the tangent of the curve at the point at vvhich the 
giyph is attached to the path. The box also shovvs the gİyph"s charvvidth (i.e., the amount vvhich the current text 
position advances horizontally vvhen the glyph is dravvn using horizontal text layout). 

The next picture zooms in further to demonstrate the detailed layout rules. 








For left-to-right horizontal text layout along a path (i.e., vvrhen the giyph orientation is perpendicular to the inline- 
progression-direction), the layout rules are as follovvs: 


e Determine the startpoint-on-the-path for the first glyph using attribute “startOffset” and property “text-an- 
chor”. For text-anchor:start, startpoint-on-the-path is the point on the path vvhich represents the point on the 
path vvhich is “startOffset” distance along the path from the start of the path, calculated using the user agentis 
distance along the path algorithm. For text-anchor:middle, startpoint-on-the-path is the point on the path 
vvhich represents the point on the path vvhich is İ “startOffset” minus half of the total advance values for all 
of the glyphs in the “textPath” element 1 distance along the path from the start of the path, calculated using 
the user agents distance along the path algorithm. For text-anchor:end, startpoint-on-the-path is the point on 


the path vvhich represents the point on the path vvhich is İ “startOffset” minus the total advance values for 
all of the glyphs in the “textPath” element 1. Before rendering the first glyph, the horizontal component of 
the startpoint-on-the-path is adiusted to take into account various horizontal alignment text properties and 
attributes, such as a “dx” attribute value on a “tspan” element. (ln the picture above, the startpoint-on-the-path 
is the leftmost dot on the path.) 

e Determine the giyph"s charvvidth (i.e., the amount vvhich the current text position advances horizontally 
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vvhen the giyph is dravvn using horizontal text layout). (In the picture above, the charvvidth is the distance 
betvveen the tvvo dots at the side of the box.) 

e Determine the point on the curve vvhich is charvvidth distance along the path from the startpoint-on-the-path 
for this gİyph, calculated using the user agent/s distance along the path algorithm. This point is the endpoint- 
on-the-path for the giyph. (In the picture above, the endpoint-on-the-path for the giyph is the rightmost dot 
on the path.) 

ə Determine the midpoint-on-the-path, vvhich is the point on the path vvhich is "halfvvay" (user agents can 





choose either a distance caleulation or a parametric calculation) betvveen the startpoint-on-the-path and the 
endpoint-on-the-path. (In the picture above, the midpoint-on-the-path is shovvn as a vvhite dot.) 

e Determine the glyph-midline, vvhich is the vertical line in the glyph"s coordinate system that goes through 
the glyph"s x-axis midpoint. (In the picture above, the glyph-midline is shovvn as a dashed line.) 

e Position the giyph such that the glyph-midline passes through the midpoint-on-the-path and is perpendicular 
to the line through the startpoint-on-the-path and the endpoint-on-the-path. 

e Align the giyph vertically relative to the midpoint-on-the-path based on property “alignment-baseline” and 
any specified values for attribute “dy” on a “tspan” element. In the example above, the “alignment-baseline” 
property is unspecifted, so the initial value of alignment-baseline:baseline vvill be used. "There are no “tspan” 
elements: thus, the baseline of the giyph is aligned to the midpoint-on-the-path. 

e For eadı subsequent giİyph, set a nevv startpoint-on-the-path as the previous endpoint-on-the-path, but vvith 
appropriate adyustments taking into account horizontal kerning tables in the font and current values of vari- 
ous attributes and properties, including spacing properties and “ispan” elements vvith values provided for at- 
tributes “dx” and “dy”. AİI adiustments are caleulated as distance adiustments along the path, calculated using 
the user agent"s distance along the path algorithm. 

e Giyphs vvhose midpoint-on-the-path are off either end of the path are not rendered. 

e Continue rendering glyphs until there are no more glyphs. 


Comparable rules are used for top-to-bottom vertical text layout along a path (i.e., vvhen the glyph orientation is 
parallel vvith the inline-progression-direction), the layout rules are as follovvs: 


e Determine the startpoint-on-the-path using the same method as for horizontal text layout along a path, ex- 
cept that before rendering the first glyph, the horizontal component of the startpoint-on-the-path is adiusted 
to take into account various vertical alignment text properties and attributes, such as a “dy” attribute value on 
a “ispan” element. 

e Determine the glyph"s charheight (i.e., the amount vvhich the current text position advances vertically vvhen 
the glyph is dravvn using vertical text layout). 

e Determine the point on the curve vvhich is charheight distance along the path from the startpoint-on-the-path 
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for this glyph, caleulated using the user agent"s distance along the path algorithm. This point is the endpoint- 
on-the-path for the glyph. 

ə Determine the midpoint-on-the-path, vvhich is the point on the path vvhich is "halfvvay" (user agents can 
choose either a distance caleulation or a parametric calculation) betvveen the startpoint-on-the-path and the 
endpoint-on-the-path. 

e Determine the giyph-midline, vvhich is the horizontal line in the glyph s coordinate system that goes through 
the glyph"s y-axis midpoint. 

e Position the giyph such that the glyph-midline passes through the midpoint-on-the-path and is perpendicular 
to the line through the startpoint-on-the-path and the endpoint-on-the-path. 

e Align the giyph horizontally (vvhere horizontal is relative to the glyph"s coordinate system) relative to the 
midpoint-on-the-path based on property “alignment-baseline” and any specifted values for attribute “dx” on a 
“tspan” element. 

e For each subsequent giİyph, set a nevv startpoint-on-the-path as the previous endpoint-on-the-path, but vvith 
appropriate adyustments taking into account vertical kerning tables in the font and current values of various 
attributes and properties, including spacing properties and “tspan” elements vvith values provided for attrib- 
utes “dx” and “dy”. AİI adiustments are caleulated as distance adiustments along the path, calculated using the 
user agent"s distance along the path algorithm. 

e Giyphs vvhose midpoint-on-the-path are off either end of the path are not rendered. 

e Continue rendering glyphs until there are no more gİyphs. 


Im the calculations above, if either the startpoint-on-the-path or the endpoint-on-the-path is off the end of the path, 
then extend the path beyond its end points vvith a straight line that is parallel to the tangent at the path at its end 
point so that the midpoint-on-the-path can still be calculated. 

VVhen the inline-progression-direction is horizontal, then any “x” attributes on “text”, “tspan”, “tref” or 
“altGiyph” elements represent nevv absolute offsets along the path, thus providing explicit nevv values for 
startpoint-on-the-path. Any “y” attributes on “text”, “tspan”, “tref” or “altGlyph” elements are ignored. VVhen the 
inline-progression-direction is vertical, then any “y” attributes on “text, “tspan, “tref” or “altGlyph” elements rep- 
resent nevv absolute offsets along the path, thus providing explicit nevv values for startpoint-on-the-path. Any “x” 
attributes on “text”, “tspan”, “tref” or “altGlyph” elements are ignored. 


10.14 Alternate giyphs 


"There are situations such as ligatures, special-purpose fonts (e.g., a font for music symbols) or alternate giyphs 
for Asian text strings vvhere it is required that a different set of glyphs is used than the glyph(s) vvhich normally 
corresponds to the given character data. 


10.14.1 The “altGiyph” element 


"The “altGlyph” element provides control over the giyphs used to render particular character data. 


Categories: “altGiyph” 
Text content element, text content child element 


Content model: 
Any elements or character data. 
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Attributes: 
conditional processing attributes 
core attributes 
graphical event attributes 
presentation attributes 
xlink attributes 
“class” 





“style” 


“externalResourcesRequired” 


s.ə 


“giyphRef” 
“format” 
“rotate” 
“xlink:href” 


DOM Tnterfaces: 
SVGAltGiyphElement 


Attribute definitions: 


xlink:href — "-iri-" 
An IRI reference either to a “glyph” element in an SVG document fragment or to an “altGiyphDef” element. 


If the reference is to a “giyph” element and that gİyph is available, then that gİyph is rendered instead of the 
character(s) that are inside of the “altGiyph” element. 


If the reference is to an “altGlyphDef” element, then if an appropriate set of alternate giİyphs is located from 
processing the “altGlyphDef” element, then those alternate gİyphs are rendered instead of the character(s) 
that are inside of the “altGiyph” element. 


Animatable: no. 


glyphRef — "-string-" 
"The glyph identifter, the format of vvhich is dependent on the “format” of the given font. (Same meaning as 
the “giyphRef” attribute on the “giyphRef” element.) 


Animatable: no. 
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format — "-string”" 
"The format of the given font. If the font is in one of the formats listed in CSS2 (İCSS2), section 15.3.5), such as 
TrueDoc1TM Portable Font Resource or Embedded OpenType, then the -string” must contain the correspond- 
ing font format string, such as fruedoc-pfr or embedded-openiype. (Ihis attribute has the same meaning as 
the “format” attribute on the “giyphRef” element.) 


Animatable: no. 


x — "-list-of-coordinates”" 
"The -coordinate” values are processed in the same manner as the “x” attribute on the “ispan” element, vvith 
the follovving exception: If the referenced alternate gİyphs are rendered instead of the Unicode characters 
inside the “altGiyph” element, then any absolute X coordinates specifted via an “x” attribute on this element 
or any ancestor “text” or “tspan” elements for Unicode characters 2 through n vvithin the “altGlyph” element 





are ignored. Any absolute X coordinate specifted via an “x” attribute on this element or any ancestor “text” or 
“ispan” elements for the first Unicode character vvithin the “altGlyph” element sets a nevv absolute X coordin- 
ate for the current text position before rendering the first alternate glyph. 

Animatable: yes. 


y — "-list-of-coordinates”" 
"The corresponding absolute Y coordinates for rendering the “altGlyph” element. 
Animatable: yes. 


dx — "-list-of-lengths-" 
"The -length” values are processed in the same manner as the “dx” attribute on the “tspan” element, vvith the 
follovving exception: If the referenced alternate glyphs are rendered instead of the Unicode characters in- 
side the “altGlyph” element, then any relative X coordinates specifted via an “dx” attribute on this element or 
any ancestor “text” or “tspan” elements for Unicode characters 2 through n vvithin the “altGlyph” element are 
ignored. Any relative X coordinate specifted via an “dx” attribute on this element or any ancestor “text” or 
“ispan” elements for the first Unicode character vvithin the “altGlyph” element sets a nevv relative X coordinate 
for the current text position before rendering the first alternate glyph. 
Animatable: yes. 


dy — "-list-of-lengths-" 
"The corresponding relative Y coordinates for rendering the “altGlyph” element. 
Animatable: yes. 


rotate — "-list-of-numbers-" 
"The -number?: values are processed in the same manner as the “rotate” attribute on the “tspan” element, vvith 
the follovving exception: If the referenced alternate gİyphs are rendered instead of the Unicode characters 


inside the “aliGliyph” element, then any supplemental rotation values specifted via an “rotate” attribute on this 
element or any ancestor “text” or “tspan” elements for Unicode characters 2 through n vvithin the “altGiyph” 
element are ignored. Supplemental rotation values specifted via an “rotate” attribute on this element or any 
ancestor “text” or “tspan” elements for the first Unicode character vvithin the “altGiyph” element sets a nevv 


c 
.o 
5 
İv) 
m") 
İs 
(3) 
E 
E 
ə) 
(ə) 
o 
ad 
. 
s 


supplemental rotation angle before rendering the alternate giyphs. 
Animatable: yes (non-additive). 


If the references to alternate glyphs do not result in successful identification of alternate glyphs to use, then the 
character(s) that are inside of the “altGiyph” element are rendered as if the “altGiyph” element vvere a “tspan” ele- 
ment instead. 

An “altGiyph” element either references a “glyph” element or an “altGlyphDef” element via its “xlink:href” at- 
tribute or identifles a glyph by means of font selection properties, a giyph identifter and a font format. İf the 
“xlink-href” attribute is specifted, it takes precedence, and the other glyph identification attributes and properties 





are ignored. 


10.14.2 The “altGiyphDef), “altGiyphitem” and “giyphRef” elements 


"The “altGiyphDef” element defines a set of possible glyph substitutions. 


Categories: “altGiyphDef” 
None 


Content model: 
Either: 
e one or more “giyphRef” elements, or 
ə one or more “altGlyphltem” elements. 


Attributes: 
core attributes 


DOM Tnterfaces: 
SVGAltGiyphDefElement 


An “altGiyphDef” can contain either of the follovving: 


e In the simplest case, an “altGlyphDef” contains one or more “glyphRef” elements. Each “giyphRef” element ref- 
erences a single giyph vvithin a particular font. If all of the referenced giyphs are available, then these glyphs 
are rendered instead of the character(s) inside of the referencing “altGiyph” element. If any of the referenced 
giyphs are unavailable, then the character(s) that are inside of the “altGlyph” element are rendered as if there 
vvere not an “altGiyph” element surrounding those characters. 

e In the more complex case, an “altGlyphDef” contains one or more “altGlyphTtem” elements. Each “altGlyphltem” 
represents a candidate set of substitute gİyphs. Each “altGlyphltem” contains one or more “glyphRef” elements. 
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Each “glyphRef” element references a single glyph vvithin a particular font. The first “altGlyphltem” in vvhich 
all referenced glyphs are available is chosen. The glyphs referenced from this “altGlyphltem” are rendered in- 
stead of the character(s) that are inside of the referencing “altGlyph” element. If none of the “altGlyphltem” 
elements result in a successful match (i.e., none of the “altGlyphTtem” elements has all of its referenced glyphs 
available), then the character(s) that are inside of the “altGiyph” element are rendered as if there vvere not an 


“altGiyph” element surrounding those characters. 


"The “altGlyphltem” element defines a candidate set of possible glyph substitutions. The first “aliGlyphltem” element 
vvhose referenced giyphs are all available is chosen. Its glyphs are rendered instead of the character(s) that are in- 
side of the referencing “altGlyph” element. 


Categories: “altGiyphitem” 
None 


Content model: 
One or more “glyphRef” elements. 


Attributes: 
core attributes 


DOM Tnterfaces: 
SVGAİltGiyphitemElement 


The “giyphRef” element defines a possible glyph to use. 


Categories: “glyphRef” 
None 


Content model: 
Empty. 


Attributes: 
core attributes 
presentation attributes 
xlink attributes 
“class” 


“style” 


... 


“giyphRef” 


“format” 
“xlink:href” 


DOM ITnterfaces: 
SVGGiyphRefElement 
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Attribute definitions: 


xlink:href - "-iri-" 
An IRI reference to a “glyph” element in an SVG document fragment. The referenced “glyph” is rendered as 
an alternate giyph. 
Animatable: no. 





glyphRef — "-string”" 
"The glyph identifter, the format of vvhich is dependent on the “format” of the given font. 
Animatable: no. 


format — "-string”" 
"The format of the given font. If the font is in one of the formats listed in CSS2 (İCSS2), section 15.3.5), such as 
TrueDoc1M Portable Font Resource or Embedded OpenType, then the -string” must contain the correspond- 
ing font format string, such as fruedoc-pfr or embedded-opentype. 
Animatable: no. 


x — "-number-" 
"This value represents the nevv absolute X coordinate vvithin the font"s coordinate system for this giyph. 
"The font coordinate system is based on the em square model desceribed in the Fonts chapter of CSS2 (TCSS2), 
chapter 15). 
If the attribute is not specifted, for the first “giyphRef” child element, the effect is as if the attribute vvere set 
to "0", vvhereas for subsequent “giyphRef” child elements, the effect is as if the attribute vvere set to the end X 
coordinate from the previous “giyphRef” element. 
Animatable: no. 


y — "-numbers" 
"The corresponding nevv absolute Y coordinate vvithin the font"s coordinate system for this glyph. 
Animatable: no. 


dx — "-number”" 
"This value represents the relative X coordinate vvithin the font"s coordinate system for this giyph. The giyph 
is thus shifted by -number” units along the positive X axis vvithin the font"s coordinate system supplemental 
to the absolute X coordinate established by the “x” attribute (either due to an explicit “x” attribute or due to 
default value processing for the “x” attribute). 
"The font coordinate system is based on the em square model described in the Fonts chapter of CSS2 (TCSS2), 
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chapter 15). 
If the attribute is not specifted, the effect is as if the attribute vvere set to "0". 
Animatable: no. 


dy — "-numbers" 
"The corresponding number of units vvithin the font"s coordinate system to shift the glyph along the positive 
Y axis relative to the absolute Y coordinate established by the “y” attribute. 
Animatable: no. 


A “giyphRef” either references a “glyph” element in an SVG document fragment via its “xlink:href” attribute or iden- 
tifles a giyph by means of font selection properties, a giİyph identifter and a font format. If insufficient attributes 
and properties have been specifted to identify a glyph, then the “giyphRef” is processed in the same manner as 
vvhen a giyph reference is fully specifted, but the given glyph is not available. If the “xlink:href” attribute is speci- 
fied, it takes precedence, and the other giyph identification attributes and properties are ignored. 


10.15 VVhite space handling 


SVG supports the standard XML attribute “xml:space” to specify the handling of vvhite space characters vvithin a 
given “text” elements character data. Note that any child element of a “text” element may also have an “xml:space” 
attribute vvhich vvill apply to that child elements text content. The SVG user agent has special processing rules 
associated vvith this attribute as deseribed belovv. These are behaviors that occur subsequent to XML parsing 
EXML10İ and any construction of a DOM. 

“xml:space” is an inheritable attribute vvhich can have one of tvvo values: 


"defauli" 
(Ihe initial/default value for “xml:space”.) V/hen xml:space-"default", the SVG user agent vvill do the follovving 
using a copy of the original character data content. First, it vvill remove all nevvline characters. Then it vvill 
convert all tab characters into space characters. Then, it vvill strip off all leading and trailing space characters. 
Then, all contiguous space characters vvill be consolidated. 

"preserve" 
VVhen xml:space-"preserve", the SVG user agent vvill do the follovving using a copy of the original character 
data content. İt vvill convert all nevvline and tab characters into space characters. Then, it vvill dravv all space 
characters, including leading, trailing and multiple contiguous space characters. Thus, vvhen dravvn vvith 
xml:space-"preserve", the string "a b" (three spaces betvveen "a" and "b") vvill produce a larger separation 
betvveen "a" and "b" than "a b" (one space betvveen "a" and "b"). 


"The follovving example illustrates that line indentation can be important vvhen using xml:space-"default". The frag- 
ment belovv shovv tvvo pairs of similar “text” elements, vvith both “text” elements using xml:space-"default". For these 
examples, there is no extra vvhite space at the end of any of the lines (i.e., the line break occurs immediately after 
the last visible character). 


(011 “text xml:spacez"default"s 
1021 VS example 
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1031 indented lines 

1041 “/text- 

1051 “text xml:spacez"preserve "SMS example indented lines-/text” 
1061 

1071 “text xml:spaceze"default"- 

(081VS example 

1091non-indented lines 

İ101 -/text- 

(111 text xml:spacez"preserve "5hS examplenon-indented 1inesc/textə” 


"The first pair of “text” elements above shovv the effect of indented character data. The attribute xml:space-"default" 


in the first “text” element instructs the user agent to: 


e convert all tabs (if any) to space characters, 

e strip out all line breaks (i.e., strip out the line breaks at the end of lines 101), 1021 and 1031), 

e strip out all leading space characters (i.e., strip out space characters before "VVS example" on line 1021), 

e strip out all trailing space characters (i.e., strip out space characters before "-/texts" on line 104), 

e consolidate all intermediate space characters (i.e., the space characters before "indented lines" on line 103)) 
into a single space character. 


The second pair of “text” elements above shovv the effect of non-indented character data. The attribute 
xml:space-"default" in the third “text” element instructs the user agent to: 


e convert all tabs (if any) to space characters, 

e strip out all line breaks (i.e., strip out the line breaks at the end of lines 107), 1081 and 1091), 

e strip out all leading space characters (there are no leading space characters in this example), 

e strip out all trailing space characters (i.e., strip out space characters before "-/texts" on line 110), 

e consolidate all intermediate space characters into a single space character (in this example, there are no in- 
termediate space characters). 


Note that XML parsers are required to convert the standard representations for a nevvline indicator (e.g., the literal 
tvvo-character sequence "ExDexA" or the stand-alone literals £xD or 5xA) into the single character PxA before 
passing character data to the application. Thus, each nevvline in SVG vvill be represented by the single character 
PXA, no matter vvhat representation for nevvlines might have been used in the original resource. (See XML end-of- 
line handling.) 

Any features in the SVG language or the SVG DOM that are based on character position number, such as the 
“x”, “y”, “dx”, “dy” and “rotate” attributes on the “text”, “span”, “tref” and “altGlyph” elements, are based on character 
position after applying the vvhite space handling rules described here. In particular, if xml:space-"default", it is of- 
ten the case that vvhite space characters are removed as part of processing. Character position numbers index into 
the text string after the vvhite space characters have been removed per the rules in this section. 

Note that a gİyph corresponding to a vvhitespace character should only be displayed as a visible but blank 
space, even if the giyph itself happens to be non-blank. See display of unsupported characters İUNICODE). 

The “xml:space” attribute is: 

Animatable: no. 


c 
.o 
5 
İv) 
m") 
(s 
(3) 
c 
E 
ə) 
(ə) 
o 
ad 
. 
s 





10.16 Text selection and clipboard operations 


Conforming SVG vievvers on systems vvhich have the capacity for text selection (e.g., systems vvhich are equipped 
vvith a pointer device such as a mouse) and vvhich have system clipboards for copy/paste operations are required 
to support: 


e user selection of text strings in SVG content 
e the ability to copy selected text strings to the system clipboard 


A text selection operation starts vvhen all of the follovving occur: 


ə the user positions the pointing device over a giyph that has been rendered as part of a “text” element, initiates 
a select operation (e.g., pressing the standard system mouse button for select operations) and then moves the 
pointing device vvhile continuing the selecf operation (e.g., continuing to press the standard system mouse 
button for select operations) 

e no other visible graphics element has been painted above the giİyph at the point at vvhich the pointing device 
vvas clicked 

e no links or events have been assigned to the “text”, “tspan” or “textPath” element(s) (or their ancestors) associ- 


ated vvith the given glyph. 


As the text selection operation proceeds (e.g., the user continues to press the given mouse button), all associated 
events vvith other graphics elements are ignored (i.e., the text selection operation is modal) and the SVG user 
agent shall dynamically indicate vvhich characters are selected by an appropriate highlighting technique, such as 
redravving the selected glyphs vvith inverse colors. As the pointer is moved during the text selection process, the 
end giyph for the text selection operation is the glyph vvithin the same “text” element vvhose giyph cell is closest to 
the pointer. Aİl characters vvithin the “text” element vvhose position vvithin the “text” element is betvveen the start 
of selection and end of selection shall be highlighted, regardless of position on the canvas and regardless of any 
graphics elements that might be above the end of selection point. 

Once the text selection operation ends (e.g., the user releases the given mouse button), the selected text vvill 
stay highlighted until an event occurs vvhich cancels text selection, such as a pointer device activation event (e.g., 
pressing a mouse button). 

Detailed rules for determining vvhich characters to highlight during a text selection operation are provided in 
Text selection implementation notes. 

For systems vvhich have system clipboards, the SVG user agent is required to provide a user interface for ini- 
tiating a copy of the currently selected text to the system clipboard. İt is sufficient for the SVG user agent to post 
the selected text string in the system s appropriate clipboard format for plain text, but it is preferable if the SVG 
user agent also posts a rich text alternative vvhich captures the various font properties associated vvith the given 
text string. 

For bidirectional text, the user agent must support text selection in logical order, vvhich vvill result in discon- 
tinuous highlighting of glyphs due to the bidirectional reordering of characters. User agents can provide an al- 
ternative ability to select bidirectional text in visual rendering order (i.e., after bidirectional text layout algorithms 
have been applied), vvith the result that selected character data might be discontinuous logically. In this case, if the 


user requests that bidirectional text be copied to the clipboard, then the user agent is required to make appropriate 
adiustments to copy only the visually selected characters to the clipboard. 

VVhen feasible, it is recommended that generators of SVG attempt to order their text strings to facilitate prop- 
erly ordered text selection vvithin SVG vievving applications such as VVeb brovvsers. 


c 
.o 
5 
İv) 
m") 
cc 
(3) 
E 
E 
ə) 
(ə) 
o 
ad 
. 
2 


10.17 DOM interfaces 


10.17.1 Interface SVG TextContentElement 


The SVGTextContentElement is inherited by various text-related interfaces, such as SVGTextElement, 
SVGTSpanElement, SVGTRefElement, SVGAltGiyphElement and SVGTextPathElement. 
For the methods on this interface that refer to an index to a character or a number of characters, these refer- 





ences are to be interpreted as an index to a UTF-16 code unit or a number of UTF-16 code units, respectively. This 
is for consisteney vvith DOM Level 2 Core, vrhere methods on the CharacterData interface use UTF-16 code units 
as indexes and counts vvithin the character data. Thus for example, if the text content of a “text” element is a single 
non-BMP character, such as U:-10000, then invoking getNumberOfChars on that element vvill return 2 since there 
are tvvo UTF-16 code units (the surrogate pair) used to represent that one character. 


interface SVGTextContentElement : SVGElement, 
SV6Tests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVGStylable 1 


// 1engthAdiust Types 

const unsigned short LENGTHAD1UST UNKNOVN 0, 

const unsigned short LENGTHAD1UST SPACING sb, 

const unsigned short LENGTHAD2UST SPACINGANDGLYPHS 2, 


readonly attribute SVGAnimatedLength textLength, 
readonly attribute SVGAnimatedEnumeration lengthAdfiust, 


1ong getNumberOfChars(), 

Tloat getComputedTextLength() , 

float getSubStringLength(in unsigned long charnum, in unsigned long nchars) raises (DOUMException) , 
SVGPoint getStartPositionOfChar(in unsigned long charnum) raises (Dü0MException), 

SVGPoint getEndPositionOfChar(in unsigned long charnum) raises(DOMException) , 

SVGRect getExtentOfChar(in unsigned long charnum) raises(DOMException), 

float getRotationOfChar(in unsigned long charnum) raises(DOMException), 

long getCharNumAtPosition(in SVGPoint point), 

void selectSubString(in unsigned long charnum, in unsigned long nchars) raises(DOMException) , 


H 


Constants in group “lengthAdiust Types”: 


e LENGTHADTUST UNKNOVVN (nsigned short) 


"The enumeration vvas set to a value that is not one of predefined types. İt is invalid to attempt to define a 
nevv value of this type or to attempt to svvitch an existing value to this type. 


e LENGTHADTUST SPACING (unsigned short) 


Corresponds to value "spacing". 
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e LENGTHAD/UST SPACINGANDGLYPHS (unsigned short) 


Corresponds to value "spacingAndGlyphs". 
Attributes: 


e textLength (readonly SVGAnimatedLength) 


Corresponds to attribute “textLength” on the given element. 


e lengthAdfust (readonly SVGAnimatedEnumeration) 


Corresponds to attribute “lengihAdiust” on the given element. The value must be one of the length adiust 


constants defined on this interface. 
Operations: 


e long getNumberOfChars() 


Returns the total number of characters available for rendering vvithin the current element, vvhich includes 
referenced characters from “tref” reference, regardless of vvhether they vvill be rendered. Effectively, this is 
equivalent to the length of the Node::textContent attribute from DOM Level 3 Core (fDOM43l, section 1.4), if 
that attribute also expanded “tref” elements. 


Returns 
Total number of characters. 


e float getComputedTextLength() 


The total sum of all of the advance values from rendering all of the characters vvithin this element, including 
the advance value on the gİyphs (horizontal or vertical), the effect of properties “kerning”, “İetter-spacing” and 
“vrord-spacing” and adiustments due to attributes “dx” and “dy” on “tspan” elements. For non-rendering envir- 


onments, the user agent shall make reasonable assumptions about giyph metrics. 


Returns 
The text advance distance. 


float getSubStringLength(in unsigned long charnum, in unsigned long nchars) 


The total sum of all of the advance values from rendering the specifted substring of the characters, including 
the advance value on the gİyphs (horizontal or vertical), the effect of properties “kerning”, “İetter-spacing” and 
“vrord-spacing” and adiustments due to attributes “dx” and “dy” on “tspan” elements. For non-rendering en- 
vironments, the user agent shall make reasonable assumptions about glyph metrics. If multiple consecutive 
characters are rendered inseparablİy (e.g., as a single glyph or a sequence of giyphs, or because the range en- 
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compasses half of a surrogate pair), and nchars is greater than 0 then the measured range shall be expanded 
so that each of the inseparable characters are included. 


Parameters 


e unsigned long charnum 
"The index of the first character in the substring, vvhere the first character has an index of 0. 


e unsigned long nehars 
The number of characters in the substring. If nchars specifies more characters than are available, then 
the substring vvill consist of all characters starting vvith charnum until the end of the list of characters. 


Returns 
The text advance distance. 


Exceptions 


e DOMEvxception, code INDEX SIZE ERR 
Raised if charnum or nchars is negative or if charnum is greater than or equal to the number of char- 


acters at this node. 


e SVGPoint getStartPositionOfChar(in unsigned long charnum) 


Returns the current text position before rendering the character in the user coordinate system for rendering 
the giyphi(s) that correspond to the specified character. The current text position has already taken into ac- 
count the effects of any inter-character adiustments due to properties “kerning”, “letter-spacing” and “vvord- 
spacing” and adiustments due to attributes “x”, “y”, “dx” and “dy”. If multiple consecutive characters are 
rendered inseparably (e.g., as a single gİyph or a sequence of giyphs), then each of the inseparable characters 
vvill return the start position for the first glyph. 


Parameters 


e unsigned long charnum 
The index of the character, vvhere the first character has an index of 0. 


Returns 
The character s start position. 


Exceptions 


e DOMEvxception, code INDEX SIZE ERR 
Raised if the charnum is negative or if charnum is greater than or equal to the number of characters at 
this node. 


e SVGPoint getEndPositionOfChar(in unsigned long charnum) 


Returns the current text position after rendering the character in the user coordinate system for rendering 
the giyph(s) that correspond to the specifted character. This current text position does nof take into account 
the effects of any inter-character adiustments to prepare for the next character, such as properties “kerning”, 


çə ə € 
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utive characters are rendered inseparably (e.g., as a single gİyph or a sequence of giyphs), then each of the 
inseparable characters vvill return the end position for the last gİyph. 


Parameters 


e unsigned long charnum 
The index of the character, vvhere the first character has an index of 0. 





Returns 
The character"s end position. 


Exceptions 


e DOMEvxception, code INDEX SIZE ERR 
Raised if the charnum is negative or if charnum is greater than or equal to the number of characters at 
this node. 


ə SVGRect getExtentOfChar(in unsigned long charnum) 


Returns a tightest rectangle vvhich defines the minimum and maximum X and Y values in the user coordinate 
system for rendering the glyph(s) that correspond to the specifted character. The caleulations assume that all 
giyphs occupy the full standard giyph cell for the font. If multiple consecutive characters are rendered insep- 
arably (e.g., as a single glyph or a sequence of glyphs), then each of the inseparable characters vvill return the 


same extent. 
Parameters 


ə unsigned long charnum 
The index of the character, vvhere the first character has an index of 0. 


Returns 
The rectangle vvhich encloses all of the rendered giyph(s). 


Exceptions 


e DOMEvxception, code INDEX SIZE ERR 
Raised if the charnum is negative or if charnum is greater than or equal to the number of characters at 
this node. 
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float getRotationOfChar(in unsigned long charnum) 


Returns the rotation value relative to the current user coordinate system used to render the giyph(s) corres- 
ponding to the specifted character. If multiple glyphis) are used to render the given character and the giyphs 
each have different rotations (e.g., due to text-on-a-path), the user agent shall return an average value (e.g., 
the rotation angle at the midpoint along the path for all glyphs used to render this character). The rotation 
value represents the rotation that is supplemental to any rotation due to properties “glyph-orientation-ho- 
rizontal” and “glyph-orientation-vertical”, thus, any glyph rotations due to these properties are not included 
into the returned rotation value. If multiple consecutive characters are rendered inseparablİy (e.g., as a single 
gİyph or a sequence of glyphs), then each of the inseparable characters vvill return the same rotation value. 


Parameters 


e unsigned long charnum 
The index of the character, vvhere the first character has an index of 0. 


Returns 
The rotation angle. 


Exceptions 


e DOMEvxception, code INDEX SIZE ERR 
Raised if the charnum is negative or if charnum is greater than or equal to the number of characters at 
this node. 


long getCharNumAtPosition(in SVGPoint poin£) 


Returns the index of the character vvhose corresponding glyph cell bounding box contains the specifted point. 
The calculations assume that all glyphs occupy the full standard glyph cell for the font. If no such character 
exists, a value of -1 is returned. If multiple such characters exist, the character vvithin the element vvhose 
gİyphs vvere rendered last (i.e., take into account any reordering such as for bidirectional text) is used. If 
multiple consecutive characters are rendered inseparably (e.g., as a single glyph or a sequence of glyphs), 
then the user agent shall allocate an equal percentage of the text advance amount to each of the contributing 
characters in determining vvhich of the characters is chosen. 


Parameters 


e SVGPoint point 
A point in user space. 


Returns 
The index of the character vvhich is at the given point, vvhere the first character has an index of 0. 
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e void selectSubString(in unsigned long charrıum, in unsigned long nchars) 


Causes the specified substring to be selected fust as if the user selected the substring interactively. 
Parameters 


e unsigned long charnum 
"The index of the start character vvhich is at the given point, vvhere the first character has an index of 0. 


e unsigned long nehars 
The number of characters in the substring. If nchars specifies more characters than are available, then 
the substring vvill consist of all characters starting vvith charnum until the end of the list of characters. 


Exceptions 


e DOMEvxception, code INDEX SIZE ERR 
Raised if charnum or nchars is negative or if charnum is greater than or equal to the number of char- 
acters at this node. 


10.17.2 Interface SVG TextPositioningElement 


The SVGTextPositioningElement interface is inherited by text-related interfaces: SVGTextElement, SVGTSpanEle- 
ment, SVGTRefElement and SVGAltGiyphElement. 


interface SVGTextPositioningElement : SVGTextContentElement ( 


H 


readonly attribute SVGAnimatedLengthList x, 
readonly attribute SVGAnimatedLengthList y, 
readonly attribute SVGAnimatedLengthList dx, 
readonly attribute SVGAnimatedLengthList dy, 
readonly attribute SVGAnimatedNumberList rotate, 


Aftributes: 


e x (readonly SVGAnimatedLengthlist) 


Corresponds to attribute “x” on the given element. 


e y (readonly SVGAnimatedLengihlist) 


Corresponds to attribute “y” on the given element. 


e dx (readonly SVGAnimatedLengihlist) 


Corresponds to attribute “dx” on the given element. 


e dy (readonly SVGAnimatedLengthList) 


Corresponds to attribute “dy” on the given element. 
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e rotate (readonly SVGAnimatedNumberlist) 


Corresponds to attribute “rotate” on the given element. 


10.17.3 Interface SVG TextElement 


The SVGTextElement interface corresponds to the “text” element. 


interface SVGTextElement : SVGTextPositioningElement, 
SVGTransformable f 





H 


10.17.4 Interface SVGTSpanElement 


The SVGTSpanElement interface corresponds to the “ispan” element. 


interface SVGTSpanElement : SVGTextPositioningElement ( 


10.17.5 Interface SVGTRefElement 


The SVGTRefElement interface corresponds to the “tref” element. 


interface SVGTRefElement : SVGTextPositioningElement, 
SVGURTReference ( 
x 


10.17.6 Interface SVG TextPathElement 


The SVGTextPathElement interface corresponds to the “textPath” element. 


interface SV6TextPathElement : SVGTextContentElement, 
SVGURTReference 


// textPath Method Types 


const unsigned short TEXTPATH METHODTYPE UNKNOMN £ 60, 
const unsigned short TEXTPATH METHODTYPE ALTGN £ 1, 
const unsigned short TEXTPATH METHODTYPE STRETCH 2, 


// textPath Spacing Types 

const unsigned short TEXTPATH SPACINGTYPE UNKNOMN — 0, 
const unsigned short TEXTPATH SPACINGTYPE AUTO £— 1, 
const unsigned short TEXTPATH SPACINGTYPE EXACT 2, 


readonly attribute SVGAnimatedLength startOffset, 
readonly attribute SVGAnimatedEnumeration method, 
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readonly attribute SVGAnimatedEnumeration spacing, 


Constants in group “textPath Method Types”: 


" TEXTPATH METHODTYPE, UNKNOVVN (unsigned short) 


The enumeration vvas set to a value that is not one of predefined types. İt is invalid to attempt to define a 
nevv value of this type or to attempt to svvitch an existing value to this type. 


e TEXTPATH METHODTYPE ALIGN (unsigned short) 


Corresponds to value "align". 
e TEXTPATH METHODTYPE STRETCH (nsigned short) 
Corresponds to value "stretch", 
Constants in group “textPath Spacing Types”: 


e TEXTPATH SPACINGTYPE UNKNOVVN (unsigned short) 


"The enumeration vvas set to a value that is not one of predefined types. İt is invalid to attempt to define a 
nevv value of this type or to attempt to svvitch an existing value to this type. 


e TEXTPATH SPACINGTYPE AUTO (nsigned short) 


Corresponds to value "auto". 
e TEXTPATH SPACINGTYPE EFXACT (unsigned short) 
Corresponds to value "exact", 
Attributes: 
e startOffset (readonly SVGAnimatedLength) 


Corresponds to attribute “startOffset” on the given “textPath” element. 


e method (readonly SVGAnimatedEnumeration) 


Corresponds to attribute “method” on the given “textPath” element. 


e spacing (readonly SVGAnimatedEnumeration) 


Corresponds to attribute “spacing” on the given “textPath” element. 


10.17.7 Interface SVGAİtGiyphElement 
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The SVGAltGiyphElement interface corresponds to the “altGiyph” element. 


interface SVGAltGlyphElement : SVGTextPositioningElement, 
SVGURTReference 1 

attribute DOMString glyphRef setraises(DOMException), 

attribute DOMString format setraises(DOMException), 

Y 


Attributes: 





e giyphRef (DOMString) 


Corresponds to attribute “giyphRef” on the given element. 


Exceptions on setting 


e DOMEvxception, code NO MODIHFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e format (DOMString) 
Corresponds to attribute “format” on the given element. 


Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


10.17.8 Interface SVGAİltGiyphDefElement 


The SVGAltGiyphDefElement interface corresponds to the “altGiyphDef” element. 


interface SVGAltGlyphDefElement : SVGElement 1 
y 


10.17.9 Interface SVGAİtGlyphlitemElement 


The SVGAltGiyphltemElement interface corresponds to the “aliGiyphltem” element. 
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interface SVGAltGlyphItemElement : SVGElement (f 


10.17.10 Interface SVGGiyphRefElement 


The SVGGiyphRefElement interface corresponds to the “glyphRef” element. 


interface SVGGlyphRefElement : SVGElement, 
SVGURTReference, 
SVöstylable £ 
attribute DOMString glyphRef setraises(DOMException), 
attribute DOMString format setraises (DOMException) , 
attribute float x setraises(DOMException) , 
attribute float y setraises(DÜMException), 
attribute float dx setraises(DÜMException), 
attribute float dy setraises(DOMException) , 
R 


Attributes: 


e giyphRef (DOMString) 


Corresponds to attribute “giyphRef” on the given element. 
Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e format (DOMString) 
Corresponds to attribute “format” on the given element. 
Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e x (float) 
Corresponds to attribute “x” on the given element. 
Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e y (float) 


Corresponds to attribute “y” on the given element. 


Exceptions on setting 
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e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e dx (float) 


Corresponds to attribute “dx” on the given element. 





Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e dy (float) 
Corresponds to attribute “dy” on the given element. 


Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


11 Painting: Filling, Stroking and Marker Symbols 
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11.6.3 Marker properties 
11.6.4 Details on hovv markers are rendered 
11.7 Rendering properties 
11.7.1 Color interpolation properties: “color-interpolation” and “color-interpolation:filters” 
11.7.2 The “color-rendering” property 
11.7.3 The “shape-rendering” property 
11.7.4 The “text-rendering” property 
11.7.5 The “image-rendering” property 
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11.1 İntroduction 


“path” elements, “text” elements and basic shapes can be filled (vvhich means painting the interior of the obfect) 
and stroked (vvhich means painting along the outline of the obiect). Filling and stroking both can be thought of in 
more general terms as painting operations. 

Certain elements (i.e., “path”, “polyline”, “polygon” and “line” elements) can also have marker symbols dravvn at 
their vertices. 

VVith SVG, you can paint (i.e., fill or stroke) vvith: 


e a single color 

e a gradient (linear or radial) 

e a pattern (vector or image, possibly tiled) 
e custom paints available via extensibility 
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SVG uses the general notion of a paint server. Paint servers are specifted using a TRİ reference on a “filP or “stroke” 


property. Gradients and patterns are fust specific types of paint servers. 


11.2 Specifying paint 
Properties “fil” and “stroke” take on a value of type -paints, vvhich is specifted as follovvs: 


nonel 
currentColor İ 
cpaint”: ccolorə? İ-icccolor?11 
xfunciri” İ none 1 currentColor / -colorx Fcicccolors111 
inherit 


none 
Imndicates that no paint is applied. 

currentColor 
Indicates that painting is done using the current animated value of the color specifted by the “color” property. 
"This mechanism is provided to facilitate sharing of color attributes betvveen parent grammars such as other 
(non-SVG) XML. This mechanism allovvs you to define a style in your HTML vvhich sets the “color” property 
and then pass that style to the SVG user agent so that your SVG text vvill dravv in the same color. 

ecolorx İ-iceccolors1 
ecolors- is the explicit color (in the sRGB color space İSRGBİ) to be used to paint the current obyect. SVG 
supports all of the syntax alternatives for -color” defined in CSS2 (TCSS2), section 4.3.6), vvith the exception 
that SVG contains an expanded list of recognized color keyvvords names. If an optional ICC color specifica- 
tion İ1CC42) is provided, then the user agent searches the color profile description database for a color pro- 
file description entry vrhose name descriptor matches the -names part of the -icccolor” and uses the last 
matching entry that is found. (If no match is found, then the ICC color specification is ignored.) The comma 
and/or vvhitespace separated list of -number”s is a set of ICC-profile-specific color values. (In most cases, 
the -number:s vvill be in the range 0 to 1.) On platforms vvhich support ICC-based color management, the 
eicccolor”- gets precedence over the -color” (vvhich is in the sRGB color space). Note that color interpolation 
occurs in an RGB color space even if an ICC-based color specification is provided (see “color-interpolation” 
and “color-interpolation-filters”). For more on ICC-based colors, refer to Color profile deseriptions. 

“funciri” 

İ nonel 
currentColor l 
ecolorx- İ-icccolorx1 1 

"The -funciri” is used to identify a paint server such as a gradient, a pattern or a custom paint defined by an 
extension (see Extensibility). The -funciri” points to the paint server (e.g., a gradient or pattern) to be used 
to paint the current obiect. If the IRI reference is not valid (e.g., it points to an obiect that doesnf exist or the 
obyect is not a valid paint server), then the paint method follovving the -funciri” (1.e., none İ currentColor ) 
ecolor”- İ-icecolors1 is used if provided: othervvise, the document is in error (see Error processing). 
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11.3 Fili Properties 
“ir 


Value: xpainto (See Specifying paint) 
lnitial: black 

Applies to: shapes and text content elements 
Inherited: yes 

Percentages: N/A 

Media: visual 


Animatable: yes 


"The “il” property paints the interior of the given graphical element. The area to be painted consists of any areas 
inside the outline of the shape. To determine the inside of the shape, all subpaths are considered, and the interior 
is determined according to the rules associated vvith the current value of the “fill-rule” property. The zero-vvidth 
geometric outline of a shape is included in the area to be painted. 

The fill operation fills open subpaths by performing the fill operation as if an additional "closepath" command 
vvere added to the path to connect the last point of the subpath vvith the first point of the subpath. Thus, fill op- 
erations apply to both open subpaths vvithin “path” elements (i.e., subpaths vvithout a closepath command) and 


“polyline” elements. 


Value: nonzero İl evenodd 1 inherit 

Initial: nonzero 

Applies to: shapes and text content elements 
Inherited: yes 

Percentages: N/A 

Media: visual 


Animatable: yes 


The “fill-rule” property indicates the algorithm vvhich is to be used to determine vvhat parts of the canvas are 
included inside the shape. For a simple, non-intersecting path, it is intuitively clear vvhat region lies "inside", 
hovvever, for a more complex path, such as a path that intersects itself or vvhere one subpath encloses another, the 
interpretation of "inside" is not so obvious. 

The “fill-rule” property provides tvvo options for hovv the inside of a shape is determined: 


nonzero 
"This rule determines the "insideness" of a point on the canvas by dravving a ray from that point to infinity in 
any direction and then examining the places vvhere a segment of the shape crosses the ray. Starting vvith a 
count of zero, add one each time a path segment crosses the ray from left to right and subtract one each time 
a path segment crosses the ray from right to left. After counting the crossings, if the result is zero then the 
point is oufside the path. Othervvise, it is inside. The follovving dravving illustrates the nonzero rule: 
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evenodd 


"This rule determines the "insideness" of a point on the canvas by dravving a ray from that point to infinity 
in any direction and counting the number of path segments from the given shape that the ray crosses. If this 
number is odd, the point is inside, if even, the point is outside. The follovving dravving illustrates the evenodd 


“Oo 


(Note: the above explanations do not specify vvhat to do if a path segment coincides vvith or is tangent to the ray. 
Since any ray vvill do, one may simply choose a different ray that does not have such problem intersections.) 


rule: 


Value: xopacity-values- 1 inherit 

lnitial: 1 

Applies to: shapes and text content elements 
inherited: yes 

Percentages: N/A 

Media: visual 


Animatable: yes 


“fill-opacity” specifies the opacity of the painting operation used to paint the interior the current obiect. (See Paint- 


ing shapes and text.) 


xopacity-value”- 
The opacity of the painting operation used to fill the current obfect, as a cnumber”. Any values outside the 
range 0.0 (fully transparent) to 1.0 (fully opaque) vvill be clamped to this range. (See Clamping values vvhich 


are restricted to a particular range.) 
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Related properties: “stroke-opacity” and “opacity”. 


11.4 Stroke Properties 


The follovving are the properties vvhich affect hovv an element is stroked. 

In all cases, all stroking properties vvhich are affected by directionality, such as those having to do vvith dash 
patterns, must be rendered such that the stroke operation starts at the same point at vvhich the graphics element 
starts. In particular, for “path” elements, the start of the path is the first point of the initial "moveto" command. 

For stroking properties such as dash patterns vvhose computations are dependent on progress along the out- 
line of the graphics element, distance caleulations are required to utilize the SVG user agent"s standard Distance 
along a path algorithms. 

VVhen stroking is performed using a complex paint server, such as a gradient or a pattern, the stroke operation 
must be identical to the result that vvould have occurred if the geometric shape defined by the geometry of the 
current graphics element and its associated stroking properties vvere converted to an equivalent “path” element and 


then filled using the given paint server. 


Value: xpainto (See Specifying paint) 
lnitial: none 

Applies to: shapes and text content elements 
inherited: yes 

Percentages: N/A 

Media: visual 


Animatable: yes 


"The “stroke” property paints along the outline of the given graphical element. 

A subpath (see Paths) consisting of a single moveto shall not be stroked. Any zero length subpath shall not be 
stroked if the “stroke-linecap” property has a value of butt but shall be stroked if the “stroke-linecap” property has a 
value of round or square, producing respectively a circle or a square centered at the given point. Examples of zero 
length subpaths include "M 10,10 L 10.10", "M 20,20 h 0", "M 30,30 z" and "M 40.40 c 0,0 0,0 0,0", 


Value: xpercentages İ -length” 1 inherit 
lnitial: 1 

Applies to: shapes and text content elements 
inherited: yes 

Percentages: Yes 

Media: visual 

Animatable: yes 


"This property speciftes the vvidth of the stroke on the current obfect. If a -percentages- is used, the value represents 


a percentage of the current vievvport. (See Units.) 
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A zero value causes no stroke to be painted. A negative value is an error (see Error processing). 


Value: butt 1 round İl square İl inherit 
Initial: butt 

Applies to: shapes and text content elements 
Inherited: yes 

Percentages: N/A 

Media: visual 


Animatable: yes 


“stroke-linecap” speciftes the shape to be used at the end of open subpaths vvhen they are stroked. For further details 


see the path implementation notes. 


butt 

See dravving belovv. 
round 

See dravving belovv. 
square 

See dravving belovv. 





"butt" cap "round" cap "square" cap 





Value: miter 1 round 1 bevel 1 inherit 
Initial: miter 

Applies to: shapes and text content elements 
inherited: yes 

Percentages: N/A 

Media: visual 


Animatable: yes 


“stroke-line/oin” speciftes the shape to be used at the corners of paths or basic shapes vvhen they are stroked. For 


further details see the path implementation notes. 


miter 

See dravving belovv. 
round 

See dravving belovv. 
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bevel 


See dravving belovv. 


““ 


"miter" 1oin "round” 1oin "bevel"” 1oin 








Value: cmiterlimit” 1 inherit 

lnitial: 4 

Applies to: shapes and text content elements 
Inherited: yes 

Percentages: N/A 

Media: visual 


Animatable: yes 


VVhen tvvo line segments meet at a sharp angle and miter İoins have been specifted for “stroke-line?oin”, it is possible 
for the miter to extend far beyond the thickness of the line stroking the path. The “stroke-miterlimit” imposes a 
limit on the ratio of the miter length to the “stroke-vvidth”. VVhen the limit is exceeded, the ioin is converted from 


a miter to a bevel. 


emiterlimit- 
The limit on the ratio of the miter length to the “stroke-vvidth”. The value of -miterlimit” must be a -number” 


greater than or equal to 1. Any other value is an error (see Error processing). 
"The ratio of miter length (distance betvveen the outer tip and the inner corner of the miter) to “stroke-vvidih” is 
directly related to the angle (theta) betvveen the segments in user space by the formula: 
miterLength / stroke-vidth c 1 / sin ( theta / 2) 
For example, a miter limit of 1.414 converts miters to bevels for theta less than 90 degrees, a limit of 4.0 converts 


them for theta less than approximately 29 degrees, and a limit of 10.0 converts them for theta less than approxim- 


ately 11.5 degrees. 


Value: none 1 cdasharray?- 1 inherit 
lnitial: none 

Applies to: shapes and text content elements 
İnherited: yes 

Percentages: yes (see belovv) 

Media: visual 

Animatable: yes (non-additive) 
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“stroke-dasharray” controls the pattern of dashes and gaps used to stroke paths. -dasharray”- contains a İist of 
comma and/or vvhite space separated -length”s and -percentage”s that specify the lengths of alternating dashes 
and gaps. If an odd number of values is provided, then the list of values is repeated to yield an even number of 
values. Thus, stroke-dasharray: 5,3,2 is equivalent to stroke-dasharray: 5,3,2,5,3,2. 





none 
mdicates that no dashing is used. If stroked, the line is dravvn solid. 

edasharray” 
A list of comma and/or vvhite space separated -lengthss (vvhich can have a unit identifter) and -percent- 
age”s. A percentage represents a distance as a percentage of the current vievvport (see Units). A negative 
value is an error (see Error processing). If the sum of the values is zero, then the stroke is rendered as if a 
value of none vvere specifted. For further details see the path implementation notes. 

The grammar for -dasharray? is as follovvs: 


dasharray ::z (length İl percentage) (comma-vsp dasharray)? 
Value: xpercentages İ -length”- 1 inherit 
lnitial: 0 


Applies to: shapes and text content elements 
inherited: yes 

Percentages: see prose 

Media: visual 

Animatable: yes 


“stroke-dashoffset” speciftes the distance into the dash pattern to start the dash. 
If a -percentages is used, the value represents a percentage of the current vievvport (see Units). 
Values can be negative. 
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Value: xopacity-values 1 inherit 

lnitial: 1 

Applies to: shapes and text content elements 
İnherited: yes 

Percentages: N/A 

Media: visual 


Animatable: yes 


“stroke-opacity” specifies the opacity of the painting operation used to stroke the current obfect. (See Painting 
shapes and text.) 


sopacity-value- 
"The opacity of the painting operation used to stroke the current obfect, as a -number”. Any values outside 
the range 0.0 (fully transparent) to 1.0 (fully opaque) vvill be clamped to this range. (See Clamping values 
vvhich are restricted to a particular range.) 


Related properties: “fill-opacity” and “opacity”. 


11.5 Controlling visibility 


SVG uses tvvo properties, “display” and “visibility”, to control the visibility of graphical elements or (in the case of 
the “display” property) container elements. 
The differences betvveen the tvvo properties are as follovvs: 


e  VVhen applied to a container element, setting “display” to none causes the container and all of its children to 
be invisible, thus, it acts on groups of elements as a group. “visibility”, hovvever, only applies to individual 
graphics elements. Setting “visibility” to hidden on a “g” vvill make its children invisible as long as the children 
do not specify their ovvn “visibility” properties as visible. Note that “visibility” is nof an inheritable property. 

e VVhen the “display” property is set to none, then the given element does not become part of the rendering tree. 
VVith “visibility” set to hidden, hovvever, processing occurs as if the element vvere part of the rendering tree 
and still taking up space, but not actually rendered onto the canvas. This distinction has implications for the 
“ispan”, “tref” and “altGlyph” elements, event processing, for bounding box calculations and for calculation of 
clipping paths. If “display” is set to none on a “tspan”, “tref” or “altGlyph” element, then the text string is ignored 
for the purposes of text layout: hovvever, if “visibility” is set to hidden, the text string is used for text layout 
(i.e., it takes up space) even though it is not rendered on the canvas. Regarding events, if “display” is set to 
none, the element receives no events, hovvever, if “visibility” is set to hidden, the element might still receive 
events, depending on the value of property “pointer-events”. The geometry of a graphics element vvith “display” 
set to none is not included in bounding box and clipping paths calculations: hovvever, even if “visibility” is to 
hidden, the geometry of the graphics element still contributes to bounding box and clipping path caleulations. 
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inline 1 block 1 list-item 1 
run-in 1 compact İ marker İl 
Value: table 1 inline-table 1 table-rovv-group 1 table-header-group İ 
table-footer-group İ table-rovv 1 table-column-group İ table-column l 
table-cell / table-caption 1 none 1 inherit 
lnitial: inline 
“svg”, “g”, “svvitch”, “a”, “foreignObiect”, graphics elements (including the “text” element) and text 


“ppiesio sub-elements (i.e., “tspan”, “tref”, “altGiyph”, “textPath”) 
inherited: no 

Percentages: N/A 

Media: all 


Animatable: yes 


A value of display: none indicates that the given element and its children shall not be rendered directly (i.e., those 
elements are not present in the rendering tree). Any value other than none or inherit indicates that the given ele- 
ment shall be rendered by the SVG user agent. 

The “display” property only affects the direct rendering of a given element, vvhereas it does not prevent ele- 
ments from being referenced by other elements. For example, setting display: none on a pat” element vvill prevent 
that element from getting rendered directly onto the canvas, but the “path” element can still be referenced by a 
“textPath” element, furthermore, its geometry vvill be used in text-on-a-path processing even if the “path” has dis- 
play: none. 

The “display” property affects direct rendering into offscreen canvases also, such as occurs vvith the imple- 
mentation model for masks. Thus, setting display: none on a child of a “mask” vvill prevent the given child element 
from being rendered as part of the mask. Similarly, setting display: none on a child of a “clipPath” element vvill pre- 
vent the given child element from contributing to the clipping path. 

Elements vvith display: none do not take up space in text layout operations, do not receive events, and do not 
contribute to bounding box and clipping paths calculations. 

Except for any additional information provided in this specification, the normative definition of the “display” 
property is the CSS2 definition (TCSS2), section 9.2.6). 


Value: visible 1 hidden 1 collapse 1 inherit 
lnitial: visible 

: graphics elements (including the “text” element) and text sub-elements (i.e., “tspan”, “tref”, “altGiyph”, 
Applies to: 

“textPath” and “a”) 

inherited: yes 
Percentages: N/A 
Media: visual 


Animatable: yes 
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visible 
"The current graphics element is visible. 
hidden or collapse 
The current graphics element is invisible (i.e., nothing is painted on the canvas). 


Note that if the “visibility” property is set to hidden on a “tspan”, “tref” or “altGlyph” element, then the text is invisible 
but still takes up space in text layout calculations. 

Depending on the value of property “pointer-events”, graphics elements vvhich have their “visibility” property 
set to hidden still might receive events. 

Except for any additional information provided in this specification, the normative definition of the “visibility” 
property is the CSS2 definition (TCSS2), section 11.2). 


11.6 Markers 


11.6.1 İntroduction 


A marhker is a symbol vvhich is attached to one or more vertices of “path”, “line”, “polyline” and “polygon” elements. 
Typically, markers are used to make arrovvheads or polymarkers. Arrovvheads can be defined by attaching a mark- 
er to the start or end vertices of “path”, “line” or “polyline” elements. Polymarkers can be defined by attaching a 
marker to all vertices of a “path”, “line”, “polyline” or “polygon” element. 

The graphics for a marker are defined by a “marker” element. To indicate that a particular “marker” element 
should be rendered at the vertices of a particular “path”, “line”, “polyline” or “polygon” element, set one or more 
marker properties (“marker”, “marker-start”, “marker-mid” or “marker-end”) to reference the given “marker” element. 

Example Marker dravvs a triangular marker symbol as an arrovvhead at the end of a path. 


c?xml versionz"1.0" standalonez"no"?z 
€ DOCTYPE svg PUBLİC "-//03C//DTD SVG 1.1//EN" 
"http: / /vuv/.vV3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
s€svg vidth-"4in" height-"2in" 
vieuvBoxz"0 0 4000 2000" version-"1.1" 
xmlnsz"http: / /vv/..v/3..0T9/2000/svg"z 
edefso” 
xmarker id-"Triangle" 
vievBoxz"0 0 10 10" refX-"0" refY-"5" 
markerUnits-e"strokeMvidth" 
markerMidth-"4" markerHeight-"3" 
oriente"auto"z 
scpath de"M 0 0 L 10 5L 60 160 z" /x 
c/markerx 
s/defss 
crect xe"10" y-"10" vidth-"3980" height-"1980" 
fill-"none" strokez"blue" stroke-vidthz"10" /5 
edescəsPlacing an arrovhead at the end of a path. 
xe/desc- 
cpath d-"M 1000 750 L 2000 750 L 2500 1250" 
fill-"none" strokeze"black" stroke-vidth-"100" 
marker-end-"ur1(£Triangle)" /s 
x/ svg” 


Example Marker 
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Markers can be animated. The animated effects vvill shovv on all current uses of the markers vvithin the document. 
11.6.2 The “marker” element 


"The “marker” element defines the graphics that is to be used for dravving arrovvheads or polymarkers on a given 
“path”, “line”, “polyline” or “polygon” element. 


Categories: “marker” 


Container element 
Content model: 

Any number of the follovving elements, in any order: 
animation elements 
descriptive elements 
shape elements 
structural elements 
gradient elements 
.” 

“altGiyphDef” 
“clipPath” 
“color-profile” 
“cursor” 

“filter” 

“font” 
“font-face” 
“foreignObiect” 
“image” 


“marker” 


“mask” 
“pattern” 
“script” 
“style” 
“svvitch” 


“text” 
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“vievv” 
Attributes: 
core attributes 
presentation attributes 
“class” 


“style” 





, 


“externalResourcesRequired 
“viev/Box” 
“preserveAspectRatio” 

“refX” 

ireby- 

“markerUnits” 
“markerVVidth” 
“markerHeight” 


“orient” 


DOM Tnterfaces: 
SVGMarkerElement 


Attribute definitions: 


markerunits — "strokeVVidth Il userSpaceOnUse" 
Defines the coordinate system for attributes “markerVVidth”, “markerHeight” and the contents of the “marker”. 
If markerUnits-"strokeVVidih", “markerVVidth”, “markerHeight” and the contents of the “marker” represent val- 
ues in a coordinate system vvhich has a single unit equal the size in user units of the current stroke vvidth 
(see the “stroke-vvidih” property) in place for the graphic obiect referencing the marker. 
If markerUnits-"userSpaceOnUse", “markerVVidth”, “markerHeight” and the contents of the “marker” represent 
values in the current user coordinate system in place for the graphic obyect referencing the marker (1e., 
the user coordinate system for the element referencing the “marker” element via a “marker”, “marker-start”, 
“marker-mid” or “marker-end” property). 
If attribute “markerUnits” is not specifted, then the effect is as if a value of "strokeVVidth" vvere specifted. 


Animatable: yes. 


refX — "-coordinates-" 
"The x-axis coordinate of the reference point vvhich is to be aligned exactly at the marker position. The co- 


ordinate is defined in the coordinate system after application of the “vievvBox” and “preserveAspectRatio” at- 
tributes. 

If the attribute is not specifted, the effect is as if a value of "0" vvere specifted. 

Animatable: yes. 
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refY — "-coordinates" 
"The y-axis coordinate of the reference point vvhich is to be aligned exactly at the marker position. The co- 
ordinate is defined in the coordinate system after application of the “vievvBox” and “preserveAspectRatio” at- 
tributes. 
If the attribute is not specifted, the effect is as if a value of "0" vvere specifted. 
Animatable: yes. 


markerilidth — "-length-" 
Represents the vvidth of the vievvport into vvhich the marker is to be fitted vvhen it is rendered. 
A negative value is an error (see Error processing). A value of zero disables rendering of the element. 
If the attribute is not specifted, the effect is as if a value of "3" vvere specifled. 





Animatable: yes. 


markerHeight - "-length-" 
Represents the height of the vievvport into vvhich the marker is to be fitted vvhen it is rendered. 
A negative value is an error (see Error processing). A value of zero disables rendering of the element. 
If the attribute is not specifted, the effect is as if a value of "3" vvere specifted. 
Animatable: yes. 


orient - "auto İ -cangle-" 
Imndicates hovv the marhker is rotated. 


A value of "auto" indicates that the marker is oriented such that its positive x-axis is pointing as follovvs: 


a, If there is a path segment coming into the vertex and another path segment going out of the vertex, the 
marker"s positive x-axis should point tovvard the angle bisector for the angle at the given vertex, vvhere 
that angle has one side consisting of tangent vector for the path segment going into the vertex and the 
other side the tangent vector for the path segment going out of the vertex. Note: 

o İftthe tangent vectors are the same, the angle bisector equals the tvvo tangent vectors. 
o fan incoming and an outgoing vertex produce a zero vector the direction of marker is undefined. 

b. If there is only a path segment going into the vertex (e.g., the last vertex on an open path), the marker s 
positive x-axis should point in the same direction as the tangent vector for the path segment going into 
the vertex. 

c. If there is only a path segment going out of the vertex (e.g., the first vertex on an open path), the mark- 
ers positive x-axis should point in the same direction as the tangent vector for the path segment going 
out of the vertex. (Refer to “path” element implementation notes for a more thorough discussion of the 


directionality of path segments.) 
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Im all cases for closed subpaths (e.g., subpaths vvhich end vvith a "closepath" command), the orientation of the 
marker corresponding to the initial point of the subpath is calculated assuming that: 


e the path segment going into the vertex is the path segment corresponding to the closepath 
e the path segment coming out of the vertex is the first path segment in the subpath 


VVhen a "closepath" command is follovved by a command other than a "moveto" command, then the orienta- 
tion of the marker corresponding to the "closepath" command is calculated assuming that: 


e the path segment going into the vertex is the path segment corresponding to the closepath 
ə the path segment coming out of the vertex is the first path segment of the subsequent subpath 


A -angle” value represents a particular orientation in the user space of the graphic obiect referencing the 
marker. For example, if a value of "0" is given, then the marker vvill be dravvn such that its x-axis vvill align 
vvith the x-axis of the user space of the graphic obfect referencing the marker. If the attribute is not specifted, 
the effect is as if a value of "0" vvere specifted. 

Animatable: yes (non-additive). 


Markers are dravvn such that their reference point (i.e., attributes “refX” and “refY”) is positioned at the given vertex. 
In other vvords, a translation transformation is constructed by the user agent to achieve the effect of having point 
(refX” and “refY”) vvithin the marker content"s coordinate system (after any transformations due to the “vievvBox” 
and preserveAspectRatio” attributes) align exactly vvith the given vertex. 

SVG"s user agent style sheet sets the “overflovr” property for “marker” elements to hidden, vvhich causes a rect- 
angular clipping path to be created at the bounds of the marker tile. Unless the “overflov/” property is overridden, 
any graphics vvithin the marker vvhich goes outside of the marker rectangle vvill be clipped. 

The contents of the “marker” are relative to a nevv coordinate system. Attribute “markerUnits” determines an 
initial scale factor for transforming the graphics in the marker into the user coordinate system for the referencing 
element. An additional set of transformations might occur if there is a “viev”Box” attribute, in vvhich case the co- 
ordinate system for the contents of the “marker” vvill be transformed due to the processing of attributes “vievvBox” 
and "preserveAspectRatio”. If there is no “vievvBox” attribute, then the assumed default value for the the “vievvBox” 
attribute has the origin of the vievvBox coincident vvith the origin of the vievvport and the vvidth/height of the 
vievvBox the same as the vvidth/height of the vievrport. 

Properties inherit into the “marker” element from its ancestors: properties do nof inherit from the element ref- 
erencing the “marker” element. 

“marker” elements are never rendered directly: their only usage is as something that can be referenced using 
the “marker”, “marker-start”, “marker-end” and “marker-mid” properties. The “display” property does not appİy to the 
“marker” element: thus, “marker” elements are not directly rendered even if the “display” property is set to a value 
other than none, and “marker” elements are available for referencing even vvhen the “display” property on the “mark- 


er” element or any of its ancestors is set to none. 
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Event attributes and event listeners attached to the contents of a “marker” element are not processed: only the 


rendering aspects of “marker” elements are processed. 


11.6.3 Marker properties 


“marker-start” defines the arrovvhead or polymarker that shall be dravvn at the first vertex of the given “path” ele- 
ment or basic shape. “marker-end” defines the arrovvhead or polymarker that shall be dravrn at the final vertex. 
“marker-mid” defines the arrovyhead or polymarker that shall be dravvn at every other vertex (i.e., every vertex ex- 
cept the first and last). Note that for a “path” element vvhich ends vvith a closed sub-path, the last vertex is the same 
as the initial vertex on the given sub-path. In this case, if “marker-end” does not equal none, then it is possible that 
tvvo markers vvill be rendered on the given vertex. One vvay to prevent this is to set “marker-end” to none. (Note 


that the same comment applies to “polygon” elements.) 





Value: none l -funciris- 1 inherit 
lnitial: none 
Applies to: “path”, “line”, “polyline” and “polygon” elements 


inherited: yes 
Percentages: N/A 
Media: visual 


Animatable: yes 


none 
Indicates that no marker symbol shall be dravvn at the given vertex (vertices). 

efunciri” 
"The -funciri” is a Functional TRI reference to the “marker” element vvhich shall be used as the arrovvhead 
symbol or polymarker at the given vertex or vertices. If the IRI reference is not valid (e.g., it points to an 
obiect that is undefined or the obiect is not a “marker” element), then the marker(s) shall not be dravvn. 


"The “marker” property specifies the marker symbol that shall be used for all points on the sets the value for all 
vertices on the given “path” element or basic shape. İt is a short-hand for the three individual marker properties: 


Value: see individual properties 

lnitial: see individual properties 

Applies to: “pat”, “line”, “polyline” and “polygon” elements 
inherited: yes 

Percentages: N/A 

Media: visual 


Animatable: yes 


11.6.4 Details on hovv markers are rendered 


Markers are dravvn after the given obfect is filled and stroked. 
For each marker that is dravvn, a temporary nevv user coordinate system is established so that the marker vvill 
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be positioned and sized correctly, as follovvs: 


e "The axes of the temporary nevv user coordinate system are aligned according to the “orient” attribute on the 
“marker” element and the slope of the curve at the given vertex. (Note: if there is a discontinuity at a vertex, 
the slope is the average of the slopes of the tvvo segments of the curve that ?oin at the given vertex. If a slope 
cannot be determined, the slope is assumed to be zero.) 

e A temporary nevv coordinate system is established by attribute “markerUnits”. If “markerUnits” equals 
"strokeVVidih", then the temporary nevv user coordinate system is the result of scaling the current user co- 
ordinate system by the current value of property “stroke-vvidth”. If “markerUnits” equals "userSpaceOnUse", then 





no extra scale transformation is applied. 

e An additional set of transformations might occur if the “marker” element includes a “vievvBox” attribute, in 
vvhich case additional transformations are set up to produce the necessary result due to attributes “vievvBox” 
and "preserveAspectRatio”. 

e Ifthe “overflovv” property on the “marker” element indicates that the marker needs to be clipped to its vievvport, 
then an implicit clipping path is established at the bounds of the vievvport. 


"The rendering effect of a marker is as if the contents of the referenced “marker” element vvere deeply cloned into 
a separate non-exposed DOM ftree for each instance of the marker. Because the cloned DOM tree is non-exposed, 
the SVG DOM does not shovr the cloned instance of the marker. 

For user agents that support Styling vvith CSS, the conceptual deep cloning of the referenced “marker” element 
into a non-exposed DOM tree also copies any property values resulting from the CSS cascade (İCSS2), chapter 6) 
and property inheritance on the referenced element and its contents. CSS2 selectors can be applied to the original 
(i.e., referenced) elements because they are part of the formal document structure. CSS2 selectors cannot be ap- 
plied to the (conceptually) cloned DOM tree because its contents are not part of the formal document structure. 

For illustrative purposes, vveTl repeat the marker example shovvn earlier: 


e?xml versione"1.0" standalonez"no"?xs 
xe IDOCTYPE svg PUBLİC "-//03C//DTD SVG 1.1//EN" 
"http: / /vvvv .v3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
€svg vidth-"4in" height-"2in" 
vievBoxz"0 0 4000 2000" version-"1.1" 
xmlnse"http:/ /uvu/.v3.org/2000/svg"z 
edefTsə” 
xmarker id-"Triangle" 
vievBoxz"0 0 10 10" refXe"0" refYe"5" 
markerUnits-"strokeMvidth" 
markervidth-"4" markerHeight-"3" 
orient-"auto"- 
epath de"M 0 0 L 10 5L 0 160 z" /5 
c/markerx 
e/deTfss 
crect xe"10" y-"10" vidth-"3980" height-"1980" 
fill-"none" strokez"blue" stroke-vidth-e"10" /s 


edescsPlacing an arrovhead at the end of a path. 
x/desc” 
cpath de"M 1000 750 L 2000 750 L 2500 1250" 
fill-"none" strokee"black" stroke-vidth-e"100" 
marker-end-"ur1(/Triangle)" /s 
x/ svg” 
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The rendering effect of the above file vvill be visually identical to the follovving: 


x?xml versionze"1.0" standalonez"no"?s 
x IDOCTYPE svg PUBLİC "-//3C//DTD SVG 1.1//EN" 
"http: / /vvv/ .v3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
€svg vidth-"4in" height-"2in" 
vievBoxze"0 0 4000 2000" versionze"1.1" 
xmlnse"http:/ /vvuv/.v3.org/2000/svg"s 
edesc-File uhich produces the same effect 
as the marker example file, but vithout 
using markers. 
xc/descəs 
xrect xe"10" y-"10" vidth-"3980" height-"1980" 
fill-"none" strokez"blue" stroke-vidth-e"10" /s 
c1-- The path dravs as before, but vithout the marker properties --x 
xpath d-"M 1000 750 L 2000 750 L 2500 1250" 
fill-"none" strokez"black" stroke-vidth-"100" /s 
c1-- The folloving logic simulates draving a marker 
at final vertex of the path. --x 
c1-- First off, move the origin of the user coordinate system 
so that the origin is nov aligned vith the end point of the path. --s 
€g transform-"translate(2500,1250)" 5 
c1-- Rotate the coordinate system 45 degrees because 
the marker specified orientze"auto" and the final segment 
of the path is going in the direction of 45 degrees. --xs 
€g transform-"rotate(45)" s 
c1-- Scale the coordinate system to match the coordinate system 
indicated by the "markerUnits" attributes, uhich in this case has 
a value of "strokeMidth". Therefore, scale the coordinate system 
by the current value of the "stroke-vidth" property, vhich is 100. -- 
€g transform-"scale(100)" 5 
c1-- Translate the coordinate system by 
(- refX”vievBoxToMarkerUnitsScaleX, -refY”vievBoxToMarkerUnitsScaleY) 
in order that (refX,refY) vithin the marker vill align vith the vertex. 
In this case, ve use the default value for preserveAspectRatio 
("xMidYMid meet"), vhich means find a uniform scale factor 
(i.e., vievBoxToMarkerUnitsScaleX-vievBoxToMarkerUnitsScaleY) 
such that the vievBox fits entirely vithin the vievport ("meet") and 
is center-aligned ("xMidYMid"). In this case, the uniform scale factor 
is markerHeight/vievBoxHeight-z3/10-.3. Therefore, translate by 
(-refX”.3,-refY".3)-(0“.3,-58.3)-(0,-1.5). --s 
€g transform-"translate(0,-1.5)" 5 
x1-- There is an implicit clipping path because the user agent style 
sheet says that the "overflov" property for markers has the value 
"hidden". To achieve this, create a clipping path at the bounds 
Of the vievport. Note that in this case the vievport extends 
0.5 units to the left and right of the vievBox due to 
a uniform scale factor, different ratios for markerMidth/vievBoxllidth 
and markerHeight/vieuvBoxHeight, and "xMidYMid" alignment --x 
eclipPath id-"cpl" x 





crect xz"-0.5" yz"0" vidth-"4" heightzc"3" /- 
c/clipPath”- 
cg clip-path-"ur1(/cp1)" s 
c1-- Scale the coordinate system by the uniform scale factor 
markerHeight/vieuvBoxHeight-c3/10-.3 to set the coordinate 
system to vievBox units. --s 
€g transformz"scale(.3)" 5 
c1-- This "g" element carries all property values that result from 
cascading and inheritance of properties on the original "marker" element. 
In this example, neither fill nor stroke vas specified on the "marker" 
element or any ancestors of the "marker", so the initial values of 
"black" and "none" are used, respectively, --s 
xg fill-"black" strokez"none" 5 
c1-- Expand out the contents of the "marker" element. --x 
epath d-"M 0 0 L 10 5L 0 10 z" /- 
c/g” 
c/g” 
c/g” 
c/g? 
c/g” 
c/g” 
c/g- 
xc/ svg” 
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11.7 Rendering properties 


11.7.1 Color interpolation properties: “color-interpolation” and “color-interpolation-fil- 
ters” 


The SVG user agent performs color interpolations and compositing at various points as it processes SVG content. 
Tevo properties, “color-interpolation” and “color-interpolation-filters”, control vvhich color space is used for particular 
categories of graphics operations. The follovving table shovvs vvhich property applies to vvhich graphics operations: 





Graphics operation Corresponding property 
interpolating betvveen gradient stops (see Gradient) “color-interpolation” 
interpolating color vvhen performing color animations vvith either “animate” or “color-interpolation” 


“animateColor” 

alpha compositing of graphics elements into the current background “color-interpolation” 

filter effecis “color-interpolation-filters” 
Both properties choose betvveen color operations occurring in the sRGB color space or in a (light energy linear) 
linearized RGB color space. Having chosen the appropriate color space, component-vvise linear interpolation is 


used. 
The conversion formulas betvveen the sRGB color space (i.e., nonlinear vvith 2.2 gamma curve) and the lin- 
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earized RGB color space (i.e., color values expressed as sRGB tristimulus values vvithout a gamma curve) can be 
found in the sRGB specification İSRGBİ. For illustrative purposes, the follovving formula shovvs the conversion 
from sRGB to linearized RGB: 


RİSRGBI - RİSRGB-8Sbitl / 255 
GİSRGB) z GİSRGB-8bitl / 255 
BİSRGBI - BİSRGB-Sbitl / 255 


If RİSRGBİ, GİSRGBİ, BİSRGBİ -- 0.04045 


RilinearRGB1 - RİSRGB) / 12.92 
GİlinearRGB1 - GİSRGB) / 12.92 
BilinearRGB)1 - BİSRGB) / 12.92 

else if RİSRGB1, GİSRGB), BİSRGBİ) x 0.04045 
RilinearRGB1 - ((RİSRGB)  0.055) / 1.055) ” 2.4 
GllinearRGB1 - ((GİSRGBİ F 0.055) / 1.055) ” 2.4 
BilinearRGB)1 - ((BİSRGB)  0.055) / 1.055) ” 2.4 


RilinearRGB-8Sbit) - RİlinearRGB)1 ” 255 
GİlinearRGB-8bitl GllinearRGB) ” 255 
BilinearRGB-8bitl) BilinearRGB1 “ 255 


Out-of-range color values, if supported by the user agent, also are converted using the above formulas. (See 
Clamping values vvhich are restricted to a particular range.) 


Value: auto İ SRGB 1 linearRGB 1 inherit 

lnitial: sRGB 

Applies to: container elements, graphics elements, “animate” and “animateColor” 
inherited: yes 

Percentages: N/A 

Media: visual 


Animatable: yes 


auto 
Imdicates that the user agent can choose either the sRGB or linearRGB spaces for color interpolation. This 
option indicates that the author doesn"t require that color interpolation occur in a particular color space. 
sRGB 
Imndicates that color interpolation should occur in the sRGB color space. 
linearRGB 
Imdicates that color interpolation should occur in the linearized RGB color space as described above. 


"The “color-interpolation” property speciftes the color space for gradient interpolations, color animations and alpha 
compositing. 

VVhen a child element is blended into a background, the value of the “color-interpolation” property on the 
child determines the type of blending, not the value of the “color-interpolation” on the parent. For gradients vvhich 
make use of the “xlink:href” attribute to reference another gradient, the gradient uses the “color-interpolation” prop- 
erty value from the gradient element vvhich is directly referenced by the “fili” or “stroke” property. V/hen animating 
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colors, color interpolation is performed according to the value of the “color-interpolation” property on the element 


being animated. 


Value: auto İ sSRGB 1 linearRGB 1 inherit 
Initial: linearRGB 

Applies to: (filter primitives 

inherited: yes 

Percentages: N/A 

Media: visual 


Animatable: yes 


auto 
Imdicates that the user agent can choose either the sRGB or linearRGB spaces for filter effects color operations. 
"This option indicates that the author doesn"t require that color operations occur in a particular color space. 
sRGB 
Indicates that filter effects color operations should occur in the sRGB color space. 
linearRGB 
Indicates that filter effects color operations should occur in the linearized RGB color space. 


"The “color-interpolation-filters” property speciftes the color space for imaging operations performed via filter ef- 
fects. 

Note that “color-interpolation-filters” has a different initial value than “color-interpolation”. “color- 
interpolation-filters” has an initial value of linearRGB, vvhereas “color-interpolation” has an initial value of sRGB. 
Thus, in the default case, filter effects operations occur in the linearRGB color space, vvhereas all other color inter- 
polations occur by default in the sRGB color space. 


11.7.2 The “color-rendering” property 


"The ecreator of SVG content might vvant to provide a hint to the implementation about hovv to make speed vs. 
quality tradeoffs as it performs color interpolation and compositing. The “color-rendering” property provides a hint 
to the SVG user agent about hovv to optimize its color interpolation and compositing operations. 

“color-rendering” takes precedence over “color-interpolation-filters”. For example, assume color-rendering: op- 
timizeSpeed and color-interpolation-filters: linearRGB. In this case, the SVG user agent should perform color op- 
erations in a vvay that optimizes performance, vvhich might mean sacrificing the color interpolation precision as 


specifted by color-interpolation-filters: linearRGB. 


Value: auto İ optimizeSpeed 1 optimizeQuality 1 inherit 
lnitial: auto 
Applies to: container elements, graphics elements, “animate” and “animateColor” 
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inherited: yes 
Percentages: N/A 
Media: visual 


Animatable: yes 


auto 
Imdicates that the user agent shall make appropriate tradeoffs to balance speed and quality, but quality shall 
be given more importance than speed. 

optimizeSpeed 
Imndicates that the user agent shall emphasize rendering speed over quality. For RGB display devices, this op- 
tion vvill sometimes cause the user agent to perform color interpolation and compositing in the device RGB 





color space. 
optimizeQuality 
Indicates that the user agent shall emphasize quality over rendering speed. 


11.7.3 The “shape-rendering” property 


"The creator of SVG content might vvant to provide a hint to the implementation about vvhat tradeoffs to make as 
it renders vector graphics elements such as “path” elements and basic shapes such as circles and rectangles. The 


“shape-rendering” property provides these hints. 


auto İ optimizeSpeed 1 crispEdges 1 


Value: : 2 : : 
geomerricPrecision İ inherit 

Initial: auto 

Applies to: shapes 

inherited: yes 

Percentages: N/A 

Media: visual 


Animatable: yes 


auto 
Imdicates that the user agent shall make appropriate tradeoffs to balance speed, crisp edges and geometric 
precision, but vvith geometric precision given more importance than speed and crisp edges. 

optimizeSpeed 
Indicates that the user agent shall emphasize rendering speed over geometric precision and crisp edges. This 
option vvill sometimes cause the user agent to turn off shape anti-aliasing. 
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erispEdges 
Imdicates that the user agent shall attempt to emphasize the contrast betvveen clean edges of artvvork over 
rendering speed and geometric precision. To achieve crisp edges, the user agent might turn off anti-aliasing 
for all lines and curves or possibly fust for straight lines vvhich are close to vertical or horizontal. Also, the 
user agent might adiust line positions and line vvidths to align edges vvith device pixels. 

geometricPrecision 
Imdicates that the user agent shall emphasize geometric precision over speed and ecrisp edges. 


11.7.4 The “text-rendering” property 


"The creator of SVG content might vvant to provide a hint to the implementation about vvhat tradeoffs to make as 
it renders text. The “text-rendering” property provides these hints. 


auto I optimizeSpeed 1 optimizeLegibility İ 


Value: : XƏKF 
geomerricPrecision 1 inherit 

lnitial: auto 

Applies to: “text” elements 


inherited: yes 
Percentages: N/A 
Media: visual 
Animatable: yes 


auto 
Imdicates that the user agent shall make appropriate tradeofis to balance speed, legibility and geometric pre- 
cision, but vvith legibility given more importance than speed and geometric precision. 

optimizeSpeed 
Indicates that the user agent shall emphasize rendering speed over legibility and geometric precision. This 
option vvill sometimes cause the user agent to turn off text anti-aliasing. 

optimizeLegibility 
Imdicates that the user agent shall emphasize legibility over rendering speed and geometric precision. The 
user agent vvill often choose vvhether to apply anti-aliasing techniques, built-in font hinting or both to pro- 
duce the most legible text. 

geometricPrecision 
Imndicates that the user agent shall emphasize geometric precision over legibility and rendering speed. This 
option vvill usually cause the user agent to suspend the use of hinting so that gİyph outlines are dravvn vvith 
comparable geometric precision to the rendering of path data. 


11.7.5 The “image-rendering” property 


"The ecreator of SVG content might vvant to provide a hint to the implementation about hovv to make speed vs. 
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quality tradeoffs as it performs image processing. The “image-rendering” property provides a hint to the SVG user 


agent about hovv to optimize its image rendering. 


"lmage-rendering” 
Value: auto İ optimizeSpeed 1 optimizeQulality 1 inherit 
Initial: auto 
Applies to: images 
inherited: yes 
Percentages: N/A 
Media: visual 
Animatable: yes 


auto 
Imdicates that the user agent shall make appropriate tradeoffs to balance speed and quality, but quality shall 
be given more importance than speed. The user agent shall employ a resampling algorithm at least as good 
as nearest neighbor resampling, but bilinear resampling is strongly preferred. For Conforming High-Quality 
SVG Vievvers, the user agent shall employ a resampling algorithm at least as good as bilinear resampling. 

optimizeQuality 
Imdicates that the user agent shall emphasize quality over rendering speed. "The user agent shall employ a 
resampling algorithm at least as good as bilinear resampling. 

optimizeSpeed 
Imdicates that the user agent shall emphasize rendering speed over quality. The user agent should use a res- 
ampling algorithm vvhich achieves the goal of fast rendering, vvith the requirement that the resampling al- 
gorithm shall be at least as good as nearest neighbor resampling. If performance goals can be achieved vvith 
higher quality algorithms, then the user agent should use the higher quality algorithms instead of nearest 
neighbor resampling. 


In all cases, resampling must be done in a truecolor (e.g., 24-bit) color space even if the original data and/or the 


target device is indexed color. 


11.8 Inheritance of painting properties 


"The values of any of the painting properties described in this chapter can be inherited from a given obiect"s parent. 
Painting, hovvever, is alvvays done on each graphics element individually, never at the container element (e.g., a 
“g”) level. Thus, for the follovving SVG, even though the gradient fill is specified on the “g”, the gradient is simply in- 
herited through the “g” element dovvn into each rectangle, each of vvhich is rendered such that its interior is painted 
vvith the gradient. 

Example mheritance 


c?xml versionz"1.0" standalone-"no"?x 
x İDOCTYPE svg PUBLİC "-//3C//DTD SVG 1.1//EN" 
"http: / /vvv/.vV3.org/Graphics/SVG/1.1/DTD/svg11.dtd"s 
€Ssvg vidth-"7cm" height-"2cm" vieuvBoxz"0 0 700 200" 
xmlnse"http: / /vvv .vV3.0r9/2000/svg" versione"1.1"5 
edescsGradients apply to 1eaf nodes 


xe/descs 
eg 
edefso” 
elinearGradient id-"MyGradient" gradientUnits-"obiectBoundingBox"s 
€stop offsetz"08" stop-colorz"£F60" /5 
€stop offsetz"1005" stop-colorz"ZFF6" /s 
e/linearGradient- 
se/defs- 
crect xe"1" y-"1" vidth-"698" height-"198" 
fill-"none" strokez"blue" stroke-vidth-"2" /5 
eg fille"ur1(£MyGradient)" x 
crect xe"100" y-"50" vidth-"200" height-"100"/5 
crect xe"400" y-"50" vidth-"200" height-"100"/5 
c/g” 
x/g” 
x/ svg” 
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Example Inheritance 








Any painting properties defined in terms of the obyect"s bounding box use the bounding box of the graphics ele- 
ment to vvhich the operation applies. Note that text elements are defined such that any painting operations defined 
in terms of the obiect"s bounding box use the bounding box of the entire “text” element. (See the discussion of 
obiect bounding box units and text elements.) 


11.9 DOM interfaces 


11.9.1 Interface SVGPaint 


The SVGPaint interface corresponds to basic type -paints and represents the values of properties “filP” and “stroke”. 
Note: The SVGPaint interface is deprecated, and may be dropped from future versions of the SVG specifica- 
tion. 


interface SV6GPaint : SVGColor (£ 


// Paint Types 

const unsigned short SVG PATINTTYPE UNKNOMN 0, 

const unsigned short SVG PAINTTYPE RGBCOLOR 1, 

const unsigned short SVG PATNTTYPE RGBCOLOR TCCCOLOR £ 2, 
const unsigned short SVG PAINTTYPE NONE — 101, 

const unsigned short SVG PATNTTYPE CURRENTCOLOR 102, 
const unsigned short SVG PATNTTYPE URI NONE — 103, 

const unsigned short SVG PATINTTYPE URI CURRENTCOLOR 104, 
const unsigned short SVG PATINTTYPE URI RGBCOLOR 105, 
const unsigned short SVG PAINTTYPE URI RGBCOLOR TCCCOLOR — 106, 
const unsigned short SVG PAITNTTYPE URI £ 107, 


readonly attribute unsigned short paintType, 
readonly attribute DÜUMString uri, 


void setUri(in DOMString uri), 

void setPaint(in unsigned short paintType, in DOMString uri, in DOMString rgbColor, in DÜUMString iccColor) 
raises(SVGException), 
iR 


Constants in group “Paint Types”: 


e SVG PAINTTYPE UNKNOVVN (nsigned short) 


The paint type is not one of predefined types. İt is invalid to attempt to define a nevv value of this type or to 
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attempt to svvitch an existing value to this type. 


e SVG PAINTTYPE RGBCOLOR (unsigned short) 


An sRGB color has been specifted vvithout an alternative ICC color specification. 


e SVG PAINTTYPE RGBCOLOR ICCCOLOR (unsigned short) 


An sRGB color has been specifted along vvith an alternative ICC color specification. 





e SVG PAINTTYPE NONE (nsigned short) 


Corresponds to a none value on a -paint” specification. 


e SVG PAINTTYPE CURRENTCOLOR (unsigned short) 


Corresponds to a currentColor value on a -paint” specification. 


e SVG PAINTTYPE URI NONE (unsigned short) 


A URİ has been specifted, along vvith an explicit none as the backup paint method in case the URİ is unavail- 
able or invalid. 


e SVG PAINTTYPE URI CURRENTCOLOR (unsigned short) 


A URI has been specifted, along vvith an sRGB color as the backup paint method in case the URİ is unavail- 
able or invalid. 


e SVG PAINTTYPE URI RGBCOLOR (unsigned short) 


A URI has been specifted, along vvith an sRGB color as the backup paint method in case the URİ is unavail- 
able or invalid. 


e SVG PAINTTYPE URI RGBCOLOR ICCCOLOR (unsigned short) 


A URİI has been specifted, along vvith both an sRGB color and alternate ICC color as the backup paint method 
in case the UR0 is unavailable or invalid. 


e SVG PAINTTYPE URİ (unsigned short) 
Only a URİ has been specifted. 


Aftributes: 
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e paintType (readonly unsigned short) 
The type of paint, identified by one of the SVG PATNTTYPE “ constants defined on this interface. 


e uri (readonly DOMString) 


VVhen the paintType speciftes a URİ, this attribute holds the URI string. V/hen the paintType does not specify 
a URİ, this attribute is null, 





Operations: 


e void setUri(in DOMString uri) 
Sets the paintType to SVG PATNTTYPE URI NONE and sets uri to the specifted value. 


Parameters 


e DOMsString uri 
The URİ for the desired paint server. 


void setPaint(in unsigned short painfType, in DOMString uzi, in DOMString rgbColor, in DOMString ic- 
cColor) 


Sets the paint as specifted by the parameters. If painfType requires a URI, then uri must be non-null: oth- 
ervvise, uri must be null. If painfType requires an RGBColor, then rgöbColor must be a string that matches 
ecolor”: othervvise, rgbColor must be null, If painfType requires an SVGICCColor, then iceColor must be a 
string that matches -icccolor”: othervvise, iceColor must be null, 


Parameters 


e unsigned short painfType 
One of the defined constants for paintType. 


ə DOMString uri 
"The URİ for the desired paint server, or null, 


e DOMString rgbColor 
"The specification of an sRGB color, or null, 


e DOMString iceColor 
"The specification of an ICC color, or null, 


Exceptions 
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ə SVGException, code SVG INVALID VALUE ERR 
Raised if one of the parameters has an invalid value. 


11.9.2 Interface SVGMarkerElement 


The SVGMarkerElement interface corresponds to the “marker” element. 


interface SV6MarkerElement : SVGElement, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVöStylable, 
SVGFitToVievBox (f 





// Marker Unit Types 

const unsigned short SVG MARKERUNITS UNKNOMN - 0, 

const unsigned short SVG MARKERUNITS USERSPACEONUSE £ 1, 
const unsigned short SVG MARKERUNITS STROKEMTDTH £ 2, 


// Marker Ürientation Types 

const unsigned short SVG MARKER ORTENT UNKNOMN - 0, 
const unsigned short SVG MARKER ORTENT AUTO — 1, 
const unsigned short SVG MARKER ORTENT ANGLE z 2, 


readonly attribute SVGAnimatedLength refTX, 

readonly attribute SVGAnimatedLength refY, 

readonly attribute SVGAnimatedEnumeration markerUnits, 

readonly attribute SVGAnimatedLength markeriMidth, 

readonly attribute SVGAnimatedLength markerHeight, 

readonly attribute SVGAnimatedEnumeration orientType, 

readonly attribute SVGAnimatedAngle orientAngle, 

void setÜrientToAuto() raises (DÜMException) , 

void setOrientToAngle(in SVGAngle angle) raises (D0MException), 
i 


Constants in group “Marker Unit Types”: 


e SVG MARKERUNITS UNKNOVVN (nsigned short) 


"The marker unit type is not one of predefined types. İt is invalid to attempt to define a nevv value of this type 
or to attempt to svvitch an existing value to this type. 


e SVG MARKERUNITS USERSPACEONUSE (nsigned short) 


"The value of attribute “markerUnits” is "userSpaceOnUse", 


e SVG MARKERUNITS STROKEVVIDTH (unsigned short) 


The value of attribute “markerUnits” is "strokeVVidih". 


Constants in group “Marker Orientation Types”: 


e SVG MARKER ORIENT UNKNOVVN (unsigned short) 


"The marker orientation is not one of predefined types. İt is invalid to attempt to define a nevv value of this 
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type or to attempt to svvitch an existing value to this type. 


e SVG MARKER ORIENT AUTO (unsigned short) 


Attribute “orient” has value "auto". 


e SVG MARKER ORIENT ANGLE (nsigned short) 


Attribute “orient” has an angle value. 





Aftributes: 


e refX (readonly SVGAnimatedLengih) 


Corresponds to attribute “refX” on the given “marker” element. 


e TefY (readonly SVGAnimatedLength) 


Corresponds to attribute “refY” on the given “marker” element. 


e markerUnits (readonly SVGAnimatedEnumeration) 


Corresponds to attribute “markerUnits” on the given “marker” element. One of the Marker Unit Types defined 
on this interface. 


e markerVVidth (readonly SVGAnimatedLength) 


Corresponds to attribute “markerVVidth” on the given “marker” element. 


e markerHeight (readonly SVGAnimatedLength) 


Corresponds to attribute “markerHeight” on the given “marker” element. 


orientType (readonly SVGAnimatedEnumeration) 


Corresponds to attribute “orient” on the given “marker” element. One of the Marker Orientation Types defined 
on this interface. 
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e orientAngle (readonly SVGAnimatedAngle) 


Corresponds to attribute “orien”? on the given “marker” element. If markerÜUnits 


SVG. MARKER ORIENT ANGLE, the angle value for attribute “orient”, othervvise, it vvill be set to zero. 


Operations: 


e void setOrientToAuto() 


Sets the value of attribute “orient” to "auto". 


Exceptions 


e DOMException, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


e void setOrientToAngle(in SVGAngle angife) 
Sets the value of attribute “orient” to the given angle. 
Parameters 


ə SVGAngle angle 
"The angle value to use for attribute “orient”. 


Exceptions 


e DOMException, code NO MODIHFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


İS 


12 Color 


Contents 
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12.1 Introduction 

12.2 The “color” property 

12.3 Color profile descriptions 
12.3.1 Overvievv of color profile deseriptions 
12.3.2 Alternative vvays of defining a color profile description 
12.3.3 The “color-profile” element 
12.3.4 The CSS (2-color-profile rule 
12.3.5 The “color-profile” property 

12.4 DOM interfaces 
12.4.1 Interface SVGColorProfileElement 
12.4.2 Interface SVGColorProfileRule 





12.1 İntroduction 


AII SVG colors are specifted in the sRGB color space (SRGBİ. At a minimum, SVG user agents shall conform to the 
color behavior requirements specifted in the color units section and the minimal gamma correction rules defined 
in the CSS2 specification. 

Additionally, SVG content can specify an alternate color specification using an ICC profile İICC42) as de- 
seribed in Specifying paint. If ICC-based colors are provided and the SVG user agent supports ICC color, then the 
ICC-based color takes precedence over the sRGB color specification, othervvise, the RGB fallback colors must be 
used. Note that, in this specification, color interpolation occurs in an RGB color space even if an ICC-based color 
specification is provided (see “color-interpolation”). 


12.2 The “color” property 


The “color” property is used to provide a potential indirect value (currentColor) for the “Til”, “stroke”, “stop-color”, 
“flood-color” and “lighting-color” properties. 
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Value: ccolor” İ inherit 

lnitial: depends on user agent 

Applies to: elements to vvhich properties “filP, “stroke”, “stop-color”, “flood-color” and “lighting-color” appiy 
Inherited: yes 

Percentages: N/A 

Media: visual 


Animatable: yes 


Except for any additional information provided in this specification, the normative definition of the property is in 
CSS2 (İCSSZ2), section 14.1). 


12.3 Color profile descriptions 


12.3.1 Overvievv of color profile descriptions 


"he International Color Consortium has established a standard, the ICC Profile HCC42), for documenting the color 
characteristics of input and output devices. Using these profiles, it is possible to build a transform and correct visu- 
al data for vievving on different devices. 

A color profile description provides the bridge betvveen an ICC profile and references to that ICC profile 
vvithin SVG content. The color profile description is added to the user agent"s list of knovvn color profiles and then 
used to select the relevant profile. The color profile description contains descriptors for the location of the color 
profile on the VVeb, a name to reference the profile and information about rendering intent. 


12.3.2 Alternative vvays of defining a color profile description 
Color profile descriptions can be specifted in either of the follovving vvays: 
e a “color-profile” element 
e an (9color-profile rule vvithin a CSS style sheet (only applicable for user agents vvhich support using CSS to 
style the SVG content İCSS21) 
If a color profile vvith the same name value has been identifted by both a “color-profile” element and (öcolor-profile 


rules vvithin a CSS style sheet, then the user agent shall first attempt to locate the profile by using the specifica- 
tions in the (Əcolor-profile rules first. 


12.3.3 The “color-profile” element 


“color-profile” 
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Categories: 


None 


Content model: 


Any number of the follovving elements, in any order: 
descriptive elements 


Attributes: 


core attributes 
xlink attributes 
“local” 

“name” 
“rendering-intent” 
“xlink:href” 


DOM Interfaces: 


SVGColorProfileElement 


Attribute definitions: 


xlink:href - "-iri-" 


"The location of an ICC profile resource. 
Animatable: no. 


Tocal — "-string”" 


name 


"The unique ID for a locally stored color profile. -string”- is the profiles unique ID as specifted by Interna- 
tional Color Consortium. If both the “xlink:href” and the “local” attributes are specifted, then the user agent 
shall search the local system for the locally stored color profile first, and, if not available locally, then attempt 
to use the resource identifted by the “xlink:href” attribute. (Note: Profile description fields do nof represent a 
profiles unique ID. VVith current ICC proposals, the profiles unique ID is an MD5-encoded value vvithin the 
profile header.) 


Animatable: no. 


— "-names" 

The name vvhich is used as the first parameter for icc-color specifications vvithin “fil”, “stroke”, “stop-color”, 
“flood-color” and “lighting-color” property values to identify the color profile to use for the ICC color specifica- 
tion and the name vvhich can be the value of the “color-profile” property. Note that if -names is not provided, 
it vvill be impossible to reference the given color profile description. The name "SRGB" is predefined: any col- 
or profile descriptions vvith -names set to "SRGB" vvill be ignored. For consisteney vvith CSS lexical scanning 
and parsing rules (TCSS2), section D.2), the keyvvord "SRGB" is case-insensitive: hovvever, it is recommended 
that the mixed capitalization "SRGB" be used for consistencey vvith common industry practice. 

Animatable: no. 


rendering-intent — "auto l perceptual İ relative-colorimetric İ saturation l absolute-colorimetric" 
“rendering-intent” permits the specification of a color profile rendering intent other than the default. 
“rendering-intent” is applicable primarily to color profiles corresponding to CMYK color spaces. The different 
options cause different methods to be used for translating colors to the color gamut of the target rendering 


device: 


c 
.o 
5 
İv) 
m") 
(səs 
(3) 
z 
E 
ə) 
(ə) 
o 
ad 
Ə 
s 


auto 
This is the default behavior. The user agent determines the best intent based on the content type. For 
image content containing an embedded profile, it shall be assumed that the intent specifted vvithin the 
profile is the desired intent. Othervvise, the user agent shall use the current profile and force the intent, 
overriding any intent that might be stored in the profile itself. 


perceptual 
"This method, often the preferred choice for images, preserves the relationship betvveen colors. It at- 
tempts to maintain relative color values among the pixels as they are mapped to the target device 
gamut. Sometimes pixel values that vvere originally vvithin the target device gamut are changed in or- 
der to avoid hue shifis and discontinuities and to preserve as much as possible the overall appearance 





of the scene. 


saturation 
Preserves the relative saturation (chroma) values of the original pixels. Out of gamut colors are conver- 
ted to colors that have the same saturation but fall fust inside the gamut. 


relative-colorimetric 
Leaves colors that fall inside the gamut unchanged. This method usually converts out of gamut colors 
to colors that have the same lightness but fall yust inside the gamut. 


absolute-colorimetric 
Disables vvhite point matching vvhen converting colors. This option is generally not recommended. 


Animatable: no. 


12.3.4 The CSS Ocolor-profile rule 


VVhen the document is styled using CSS, the (3eolor-profile rule can be used to specify a color profile description. 
The general form is: 


gcolor-profile ( ccolor-profile-description” ) 
vvhere the -color-profile-description” has the form: 
descriptor: value, 


b... 
descriptor: value, 
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Each (9color-profile rule speciftes a value for every color profile deseriptor, either implicitly or explicitly. Those 
not given explicit values in the rule take the initial value listed vvith each deseriptor in this specification. These 
descriptors apply solely vvrithin the context of the (Əcolor-profile rule in vvhich they are defined, and do not apply 
to document language elements. Thus, there is no notion of vvhich elements the descriptors apply to, or vvhether 
the values are inherited by child elements. 

The follovving are the descriptors for a -color-profile-deseription”: 


Values:sRGB 1 -local-profile”- 1 ciris. 1 (xlocal-profiles -iris) 1 inherit 
Initial: sRGB 
Media: visual 


sRGB 
"The source profile is the sRGB color space. For consisteney vvith CSS lexical scanning and parsing rules 
(İCSS2), section D.2), the keyvvord "SRGB" is case-insensitive: hovvever, it is recommended that the mixed 
capitalization "SRGB" be used for consisteney vvith common industry practice. 

elocal-profile- 
"The source profile is a locally-stored profile. The syntax for -local-profiles is: 


"local(" FE cstring” 4 ")" 


vvhere -string” is the profiles unique ID as specifted by International Color Consortium. (Note: Profile de- 
seription ftelds do nof represent a profiles unique ID. VVith current ICC proposals, the profile"s unique ID is 
an MD5-encoded value vvithin the profile header.) 

siri” 
"The source profile is a IRI reference to a color profile. 

(clocal-profiles -iri-) 
Tevo profiles are specifted. If -local-profile- cannot be found on the local system, then the -iri” is used. 


Values:xname- 
Initial: undefined 
Media: visual 


“name” 
See the description for the “name: attribute on the “color-profile” element. Note that if -names is not provided, 
it vvill be impossible to reference the given (öcolor-profile definition. 


auto İ perceptual 1 relative-colorimetric 1 


Values: ı : : 
saturation Il absolute-colorimetric 

lnitial: auto 

Media: visual 
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Animatable: no 


See the description for the “rendering-intent” attribute on the “color-profile” element. 
12.3.5 The “color-profile” property 
“color-profile” 





Value: auto İ SRGB İ -names İ ciri” 1 inherit 
lnitial: auto 

Applies to: “image” elements that refer to raster images 
inherited: yes 

Percentages: N/A 

Media: visual 


Animatable: yes 


auto 
"This is the default behavior. AlI colors are presumed to be defined in the sRGB color space unless a more 
precise embedded profile is specifled vvithin content data. For images that do have a profile built into their 
data, that profile is used. For images that do not have a profile, the SRGB profile is used. 

sRGB 
"The source profile is assumed to be sRGB. This differs from auto in that it overrides an embedded profile 


inside an image. 


For consisteney vvith CSS lexical scanning and parsing rules (İCSS2), section D.2), the keyvvord "SRGB" is 
case-insensitive: hovvever, it is recommended that the mixed capitalization "SRGB" be used for consisteney 
vvith common industry practice. 

“name” 
A name corresponding to a defined color profile that is in the user agent"s color profile description database. 
"The user agent searches the color profile deseription database for a color profile description entry vvhose 
name descriptor matches -names and uses the last matching entry that is found. If a match is found, the cor- 
responding profile overrides an embedded profile inside an image. If no match is found, then the embedded 
profile inside the image is used. 

siri” 
A IRİ reference to the source color profile. The referenced color profile overrides an embedded profile inside 
the image. 
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12.4 DOM interfaces 


12.4.1 Interface SVGColorProfileElement 


The SVGColorProfileElement interface corresponds to the “color-profile” element. 


interface SV6GColorProfileElement : SVGElement, 
SVGURTReference, 
SVGRenderingintent 1 

attribute DÜMString local, 

attribute DOMString name, 

attribute unsigned short renderingintent, 

y 


Afttributes: 


e local (DOMString) 


Corresponds to attribute “local” on the given element. 


e name (DOMsString) 


Corresponds to attribute “name” on the given element. 


e renderingintent (unsigned short) 


Corresponds to attribute “rendering-intent” on the given element. The value of this attribute is the value of 
the the RENDERING INTENT “ constant defined on SVGRenderingintent that corresponds to the value of 
the “rendering-intent” attribute. 


12.4.2 Interface SVGColorProfileRule 


The SVGColorProfileRule interface represents an (9color-profile rule in a CSS style sheet. An (öcolor-profile rule 
identiftes a ICC profile vvhich can be referenced vvithin a given document. 
Support for the SVGColorProfileRule interface is only required in user agents that support styling vvith CSS. 


interface SV6GColorProfileRule : SVGCSSRuLe, 
SVGRenderingintent 1 
attribute DOMString src setraises (D0MException) , 
attribute DOMString name setraises(DOMException) , 
attribute unsigned short renderingintent setraises(DOMException) , 
y 


Aftributes: 


ə src (DOMString) 


Corresponds to descriptor sre vvithin an (öcolor-profile rule. 


Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 
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e name (DOMString) 


Corresponds to descriptor “name” vvithin an (öcolor-profile rule. 


Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 





e renderingintent (unsigned short) 


"The type of rendering intent, identified by one of the SVGRenderingintent constants. 


Exceptions on setting 


e DOMEvxception, code NO MODIHFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 
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13 (Guradients and Patterns 


Contents 


13.1 İntroduction 
13.2 Gradients 
13.2.1 Introduction 
13.2.2 Linear gradients 
13.2.3 Radial gradients 
13.2.4 Gradient stops 
13.3 Patterns 
13.4 DOM interfaces 
13.4.1 Interface SVGGradientElement 
13.4.2 Interface SVGLinearGradientElement 
13.4.3 Interface SVGRadialGradientElement 
13.4.4 Interface SVGStopElement 
13.4.5 Interface SVGPatternElement 


13.1 İntroduction 


VVith SVG, you can fill (i.e., paint the interior) or stroke (i.e., paint the outline) of shapes and text using one of the 
follovring: 


e color (using -color”) 
e gradients (linear or radial) 
e patterns (vector or image, possibİy tiled) 


SVG uses the general notion of a paint server. Gradients and patterns are fust specific types of built-in paint serv- 


ers. 
Paint servers are referenced using an IRI reference on a “ill” or “stroke” property. 


13.2 Gradients 


13.2.1 Introduction 


Gradients consist of continuously smooth color transitions along a vector from one color to another, possibly fol- 
lovved by additional transitions along the same vector to other colors. SVG provides for tvvo types of gradients: 
linear gradients and radial gradienis. 
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Once defined, gradients are then referenced using “fili” or “stroke” properties on a given graphics element to 
indicate that the given element shall be filled or stroked vvith the referenced gradient. 

The angle of the color transitions along the gradient vector is defined by the gradient normal. Before any 
transforms are applied to the gradient or its referencing graphics element, the gradient normal is perpendicular 
vvith the gradient vector. If a graphics element references a gradient, conceptually the graphics element should 
take a copy of the gradient vector and gradient normal and treat it as part of its ovvn geometry. Any transforma- 
tions applied to the graphics element geometry also apply to the copied gradient vector and gradient normal. Any 
gradient transforms that are specifted on the reference gradient are applied before any graphics element trans- 
formations are applied to the gradient. 


Vector 





İRULON 





13.2.2 Linear gradients 


Linear gradients are defined by a “linearGradient” element. 


Categories: “linearGradient” 
Gradient element 


Content model: 
Any number of the follovving elements, in any order: 
descriptive elements 
“animate” 
“animateTransform” 
“set” 
“stop” 


Attributes: 
core attributes 
presentation attributes 
xlink attributes 
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“class” 
“style” 


. 


“externalResourcesRequired 


“gradientUnits” 





“gradientTransform” 
“spreadMethod” 
“xlink:href” 


DOM Tnterfaces: 
SVGLinearGradientElement 


Attribute definitions: 


gradientunits - "userSpaceOnUse 1 obiectiBoundingBox" 
Defines the coordinate system for attributes “x1”, “y1”, “x2” and “y?”. 
If gradientUnits-"userSpaceOnUse", “x1”, “y1”, “x2” and “y2” represent values in the coordinate system that res- 
ults from taking the current user coordinate system in place at the time vvhen the gradient element is refer- 
enced (i.e., the user coordinate system for the element referencing the gradient element via a “ill” or “stroke” 
property) and then applying the transform specifted by attribute “gradientTransform”. 
If gradientUnits-"obiectBoundingBox", the user coordinate system for attributes “x1”, “y1”, “x2” and “y2” is es- 
tablished using the bounding box of the element to vvhich the gradient is applied (see Obiect bounding box 
units) and then applying the transform specifted by attribute “gradientTransform”. 
VVhen gradientUnits-"obiectBoundingBox" and “gradientTransform”: is the identity matrix, the normal of the 
linear gradient is perpendicular to the gradient vector in obfect bounding box space (i.e., the abstract co- 
ordinate system vvhere (0,0) is at the top/left of the obiect bounding box and (1,1) is at the bottom/right of the 
obiect bounding box). VVhen the obfiectis bounding box is not square, the gradient normal vvhich is initially 
perpendicular to the gradient vector vvithin obiect bounding box space may render non-perpendicular relat- 
ive to the gradient vector in user space. If the gradient vector is parallel to one of the axes of the bounding 
box, the gradient normal vvill remain perpendicular. This transformation is due to application of the non- 
uniform scaling transformation from bounding box space to user space. 
If attribute “gradientUnits” is not specifted, then the effect is as if a value of "obiectBoundingBox" vvere speci- 
fied. 
Animatable: yes. 
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gradientTransform  "-transform-list-" 
Contains the definition of an optional additional transformation from the gradient coordinate system onto 
the target coordinate system (i.e., userSpaceOnUse or obiectBoundingBox). This allovvs for things such as 
skevving the gradient. This additional transformation matrix is post-multiplied to (i.e., inserted to the right 
of) any previously defined transformations, including the implicit transformation necessary to convert from 
obiect bounding box units to user space. 
If attribute “gradientTransform” is not specifted, then the effect is as if an identity transform vvere specifled. 
Animatable: yes. 


x1 — "-coordinates" 
“x1”, “y1,, “x2” and “yz” define a gradient vector for the linear gradient. This gradient vector provides starting 
and ending points onto vvhich the gradient stops are mapped. The values of “xT,, “y1”, “x2” and “y2” can be 
either numbers or percentages. 
If the attribute is not specifted, the effect is as if a value of "07" vvere specifted. 
Animatable: yes. 


y1 — "-coordinates”" 
See “x1”. 
If the attribute is not specifted, the effect is as if a value of "07" vvere specifted. 
Animatable: yes. 


X2 £ "-coordinates" 
See “x1”. 
If the attribute is not specifted, the effect is as if a value of "10077" vvere specifted. 
Animatable: yes. 


y2 — "-coordinates" 
See “x1”. 
If the attribute is not specifted, the effect is as if a value of "07" vvere specifted. 
Animatable: yes. 


spreadMethod — "pad İ reflect İ repeat" 
Indicates vvhat happens if the gradient starts or ends inside the bounds of the targef rectangle. Possible values 
are: "pad", vvhich says to use the terminal colors of the gradient to fill the remainder of the target region, "re- 
flect", vvhich says to reflect the gradient pattern start-to-end, end-to-start, start-to-end, etc. continuously until 
the farget rectangle is filled, and repeat, vvhich says to repeat the gradient pattern start-to-end, start-to-end, 
start-to-end, etc. continuouslİy until the target region is filled. 
If the attribute is not specifted, the effect is as if a value of "pad" vvere specifted. 
Animatable: yes. 


xlink:href - "-iri-" 
An IRI reference to a different “İinearGradient” or “radialGradient” element vvithin the current SVG document 
fragment. Any TinearGradient” attributes vvhich are defined on the referenced element vvhich are not defined 


on this element are inherited by this element. If this element has no defined gradient stops, and the referen- 
ced element does (possibly due to its ovvn “xlink:href” attribute), then this element inherits the gradient stop 
from the referenced element. Inheritance can be indirect to an arbitrary level, thus, if the referenced element 
inherits attribute or gradient stops due to its ovvn “xlink:href” attribute, then the current element can inherit 
those attributes or gradient stops. 
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Animatable: yes. 


Percentages are allovved for “x1”, “yT1”, “x2” and “y2”. For gradientUnits-"userSpaceOnUse", percentages represent val- 
ues relative to the current vievvport. For gradientUnits-"obiectBoundingBox", percentages represent values relative 
to the bounding box for the obiect. 

If “xr” - “x?” and “yr” - “y2”, then the area to be painted vvill be painted as a single color using the color and 
opacity of the last gradient stop. 

Properties inherit into the “inearGradient” element from its ancestors, properties do nof inherit from the ele- 





ment referencing the “inearGradient” element. 

“İinearGradient” elements are never rendered directly: their only usage is as something that can be referenced 
using the “fil” and “stroke” properties. The “display” property does not apply to the “linearGradient” element: thus, 
“İinearGradient” elements are not directly rendered even if the “display” property is set to a value other than none, 
and “inearGradient” elements are available for referencing even vvhen the “display” property on the “linearGradient” 
element or any of its ancestors is set to none. 

Example lingrad01 shovvs hovv to fill a rectangle by referencing a linear gradient paint server. 


c?xml versionz"1.0" standalone-"no"?x 
x İDOCTYPE svg PUBLİC "-//0/3C///DTD SVG 1.1//EN" 
"http: / /vvv/.v/3.org/Graphics/SVG/1.1/DTD/svg11.dtd"s 
c€svg vidth-"8cm" height-"4cm" vievBoxz"0 0 800 400" versionz"1.1" 
xmlnsz"http: / /vuv/ .v(3.0T9/2000/svg"z 
edescsExample lingrad01 - fill a rectangle using a 
linear gradient paint server-/desc” 
eg 
edefsəs 
elinearGradient id-"MyGradient"s 
€stop offsetz"58" stop-colorz"£F60" /5 
e€stop offsetz"955:" stop-colorz"EFF6" /5 
e/linearGradient- 
e/defs- 


c1-- Üutline the draving area in blue --x 
erect fill-"none" strokez"blue" 
xe"1" ye-"1" vidth-"798" height-"398"/5 


c1-- The rectangle is filled using a linear gradient paint server --x 
crect fille"url(£MyGradient)" strokeze"black" stroke-vidthe"5" 
xz"100" y-"100" vidth-"600" height-"200"/5 
x/g” 
s/ svg” 
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13.2.3 Radial gradients 





Radial gradients are defined by a “radialGradient” element. 


Categories: “radialGradient” 
Gradient element 


Content model: 
Any number of the follovving elements, in any order: 
descriptive elements 
“animate” 
“animateTransform” 
“set” 
“stop” 


Attributes: 
core attributes 
presentation attributes 
xlink attributes 
“class” 
“style” 


“externalResourcesRequired” 


"r 
“gradientUnits” 
“gradientTransform” 
“spreadMethod” 
“xlink:href” 


DOM Tnterfaces: 
SVGRadialGradientElement 
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Attribute definitions: 


gradientunits - "userSpaceOnUse 1 obiectBoundingBox" 
Defines the coordinate system for attributes “ex”, “ey”, “r”, “fx” and “fy”. 
If gradientUnits-"userSpaceOnUse", “ex”, “ey”, “r”, “fx” and “fy” represent values in the coordinate system that 
results from taking the current user coordinate system in place at the time vvhen the gradient element is 
referenced (i.e., the user coordinate system for the element referencing the gradient element via a “fil” or 


“stroke” property) and then applying the transform specifted by attribute “gradientTransform”. 





If gradientUnits-"obiectBoundingBox", the user coordinate system for attributes “ex”, “ey”, “r”, “fx” and “fy” is 
established using the bounding box of the element to vvhich the gradient is applied (see Obiect bounding box 
units) and then applying the transform specifted by attribute “gradientTransform”. 

VVhen gradientUnits-"obiectBoundingBox" and “gradientTransform” is the identity matrix, then the rings of 
the radial gradient are circular vvith respect to the obiect bounding box space (i.e., the abstract coordinate 
system vvhere (0,0) is at the top/left of the obiect bounding box and (1,1) is at the bottom/right of the obiect 
bounding box). VVhen the obiect"s bounding box is not square, the rings that are conceptually circular vvithin 
obiect bounding box space vvill render as elliptical due to application of the non-uniform scaling transform- 
ation from bounding box space to user space. 

If attribute “gradientUniis” is not specifted, then the effect is as if a value of "obiectBoundingBox" vvere speci- 
fled. 


Animatable: yes. 


gradientTransform — "-transform-list-" 
Contains the definitions of an optional additional transformation from the gradient coordinate system onto 
the target coordinate system (i.e., userSpaceOnUse or obiectBoundingBox). This allovvs for things such as 
skevving the gradient. This additional transformation matrix is post-mulltiplied to (i.e., inserted to the right 
of) any previously defined transformations, including the implicit transformation necessary to convert from 
obiect bounding box units to user space. 
If attribute “gradieniTransform” is not specifted, then the effect is as if an identity transform vvere specifted. 


Animatable: yes. 


cx € "-coordinates" 
“ex”, “ey” and “r” define the largest (i.e., outermost) circle for the radial gradient. The gradient vvill be dravvn 
such that the 1007) gradient stop is mapped to the perimeter of this largest (i.e., outermost) circle. 
If the attribute is not specifted, the effect is as if a value of "507 vvere specifted. 
Animatable: yes. 


cy — "-coordinates" 


See “ex”. 


If the attribute is not specifted, the effect is as if a value of "507 vvere specifted. 
Animatable: yes. 


r — "-lengths" 


See “ex”. 
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A negative value is an error (see Error processing). A value of zero vvill cause the area to be painted as a 
single color using the color and opacity of the last gradient stop. 

If the attribute is not specifted, the effect is as if a value of "507 vvere specifted. 

Animatable: yes. 


fx — "-coordinates" 
“fx” and “fy” define the focal point for the radial gradient. The gradient vvill be dravvn such that the 077 gradi- 
ent stop is mapped to (fx, fy). 
If attribute “fx” is not specifted, “fx” vvill coincide vvith the presentational value of “ex” for the element vvhether 





the value for "ex" vvas inherited or not. If the element references an element that speciftes a value for "x", then 
the value of "İx" is inherited from the referenced element. 
Animatable: yes. 


Ty — "-coordinates" 
See “fx”. 
If attribute “fy” is not specifted, “fy” vvill coincide vvith the presentational value of “ey” for the element vvhether 
the value for "ey" vvas inherited or not. If the element references an element that speciftes a value for Ty, then 
the value of "Ty" is inherited from the referenced element. 
Animatable: yes. 


spreadMethod “ "pad İ reflect İ repeat" 
Imdicates vvhat happens if the gradient starts or ends inside the bounds of the obfect(s) being painted by the 
gradient. Has the same values and meanings as the “spreadMethod” attribute on “linearGradient” element. 


Animatable: yes. 


xlink:href - "-iri-" 

An TRİ reference to a different “İinearGradient” or “radialGradient” element vvithin the current SVG document 
fragment. Any TadialGradient” attributes vvhich are defined on the referenced element vvhich are not defined 
on this element are inherited by this element. If this element has no defined gradient stops, and the referen- 
ced element does (possibly due to its ovvn “xlink:href” attribute), then this element inherits the gradient stop 
from the referenced element. Inheritance can be indirect to an arbitrary level, thus, if the referenced element 
inherits attribute or gradient stops due to its ovvn “xlink:href” attribute, then the current element can inherit 
those attributes or gradient stops. 

Animatable: yes. 


Percentages are allovved for attributes “ex”, “ey”, “r”, “fx” and “Ty”. For gradientUnits-"userSpaceOnUse", percentages 
represent values relative to the current vievvport. For gradientUnits-"ob)ectBoundingBox", percentages represent 
values relative to the bounding box for the obiect. 
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If the point defined by “fx” and “fy” lies outside the circle defined by “ex”, “ey” and “r”, then the user agent shall 
set the focal point to the intersection of the line from ("ex”, “ey”) to (fx”, “fy”) vvith the circle defined by “ex”, “ey” and 


ə 


r. 

Properties inherit into the “radialGradient” element from its ancestors: properties do nof inherit from the ele- 
ment referencing the “radialGradient” element. 

“radialGradient” elements are never rendered directly: their only usage is as something that can be referenced 
using the “fil” and “stroke” properties. The “display” property does not apply to the “radialGradient” element: thus, 
“radialGradient” elements are not directly rendered even if the “display” property is set to a value other than none, 
and “radialGradient” elements are available for referencing even vvhen the “display” property on the “radialGradient” 
element or any of its ancestors is set to none. 

Example radgrad01 shovvs hovv to fill a rectangle by referencing a radial gradient paint server. 


c?xml versionz"1.0" standalonez"no"?z 
€ DOCTYPE svg PUBLİC "-//V3C//DTD SVG 1.1//EN" 
"http: / /vvv .v3.org/Graphics/SVG/1.1/DTD/svg11.dtd"x 
s€svg vidth-"8cm" height-"4cm" vieuvBoxz"0 0 800 400" version-"1.1" 
xmlnse"http: / /uvv .vV3.0T9/2000/svg"ə” 
cdescsExample radgrad01 - fill a rectangle by referencing a 
radial gradient paint server-/desc” 
cg 
edefsəs 
cradialGradient id-"MyGradient" gradientUnits-"userSpace0nUse" 
cxz"400" cyz"200" rz"300" fxz"400" fyz"200"5 
€stop offsetz"08" stop-colorz"red" /s 
€stop offsetz"505-" stop-colorz"blue" /s 
€stop offsetz"10055" stop-colorz"red" /s 
c/ radialGradient- 
x/defs- 


c€1-- QOutline the draving area in blue --s 
crect fill-"none" strokez"blue" 
xe"1" y-"1" vidth-"798" height-"398"/5 


c1-- The rectangle is filled using a radial gradient paint server --x 
crect fill-"url(/MyGradient)" strokez"black" stroke-vidth-"5" 
xz"100" y-"100" vidth-"600" height-"200"/5 





x/g” 
x/ svg” 
Example radgrad01 
13.2.4 Gradient stops 


The ramp of colors to use on a gradient is defined by the “stop” elements that are child elements to either the “lin- 
earGradient” element or the “radialGradient” element. 
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Categories: “stop” 
None 


Content model: 
Any number of the follovving elements, in any order: 
“animate” 
“animateColor” 


“set” 


Attributes: 
core attributes 
presentation attributes 
“class” 
“style” 
“offset” 


DOM Tnterfaces: 
SVGStopElement 


Attribute definitions: 


offset — "-number: / -percentages" 
The “offset” attribute is either a -number” (usually ranging from 0 to 1) or a -percentage”- (usually ranging 
from 077 to 10072) vvhich indicates vvhere the gradient stop is placed. For linear gradients, the “offset” attribute 
represents a location along the gradient vector. For radial gradients, it represents a percentage distance from 
(fx fy) to the edge of the outermost/largest circle. 
Animatable: yes. 


"The “stop-color” property indicates vvhat color to use at that gradient stop. The keyvvord currentColor and ICC col- 
ors can be specifted in the same manner as vvithin a -paint” specification for the “fili” and “stroke” properties. 


currentColor İ 


Value: ccolorə- cicccolorə- İ 
inherit 

lnitial: black 

Applies to: “stop” elements 

Inherited: no 

Percentages: N/A 

Media: visual 


Animatable: yes 


"The “stop-opacity” property defines the opacity of a given gradient stop. 
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Value: xopacity-values 1 inherit 
Initial: 1 

Applies to: “stop” elements 
Inherited: no 

Percentages: N/A 

Media: visual 


Animatable: yes 


Some notes on gradients: 





e Gradient offset values less than 0 (or less than 072) are rounded up to 077. Gradient offset values greater than 
1 (or greater than 10077) are rounded dovvn to 10077. 

e İt is necessary that at least tvvo stops defined to have a gradient effect. If no stops are defined, then painting 
shall occur as if one" vvere specifted as the paint style. If one stop is defined, then paint vvith the solid color 
fill using the color defined for that gradient stop. 

e Each gradient offset value is required to be equal to or greater than the previous gradient stop s offset value. 
If a given gradient stop/s offset value is not equal to or greater than all previous offset values, then the offset 
value is adiusted to be equal to the largest of all previous offset values. 

e İf tvvo gradient stops have the same offset value, then the latter gradient stop controİls the color value at the 
overlap point. In particular: 

xstop offsete"0" stop-colore"uhite"/s 
€stop offsete".2" stop-colorze"red"/s 


xstop offsete".2" stop-colore"blue"/s 
xstop offsete"1" stop-colore"black"/s 


vvill have approximately the same effect as: 


xstop offsete"0" stop-colore"uhite"/s 
xstop offsete" . 1999999999" stop-colorze"red"/s 
€stop offsete".2" stop-colore"blue"/s 
xstop offsete"1" stop-colore"black"/s 


vvhich is a gradient that goes smoothly from vvhite to red, then abruptly shifts from red to blue, and then goes 
smoothly from blue to black. 


13.3 Patterns 


A pattern is used to fill or stroke an obfect using a pre-defined graphic obfect vvhich can be replicated ("tiled") at 
fixed intervals in x and y to cover the areas to be painted. Patterns are defined using a “pattern” element and then 
referenced by properties “fil” and “stroke” on a given graphics element to indicate that the given element shall be 
filled or stroked vvith the referenced pattern. 


Attributes “x”, “y”, “vridth”, “height” and “patternUnits” define a reference rectangle somevvhere on the infinite 
canvas. The reference rectangle has its top/left at (x, y) and its bottom/right at (x - vvidth, y - height). The tiling 
theoretically extends a series of such rectangles to infinity in X and Y (positive and negative), vvith rectangles 
starting at (x - m”vvidth, y £ n” height) for each possible integer value for m and n. 


c 
.o 
5 
İv) 
m") 
(səs 
(3) 
z 
E 
ə) 
(ə) 
o 
ad 
Ə 
s 


Categories: “pattern” 
Container element 


Content model: 
Any number of the follovving elements, in any order: 
animation elements 
descriptive elements 





shape elements 
structural elements 
gradient elements 
“a” 
“altGiyphDef” 
“clipPath” 
“color-profile” 
“cursor” 
“filter” 
“font” 
“font-face” 
“foreignObiect” 
“image” 
“marker” 
“mask” 
“pattern” 
“script” 
“style” 
“svvitch” 
dexi 
“vievv” 
Attributes: 
conditional processing attributes 
core attributes 
presentation attributes 
xlink attributes 
“class” 
“style” 


“externalResourcesRequired” 


“vievvBox” 


“preserveAspectRatio” 


üə 


x 


səsə 


y 
“vvidth” 
“height” 


“patternUnits” 
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“patternContentUnits” 
“patternTransform” 
“xlink:href” 


DOM Interfaces: 
SVGPatternElement 





Attribute definitions: 


patternünits — "userSpaceOnUse l obiectBoundingBox" 
Defines the coordinate system for attributes “x”, "y”, “vvidth” and “height”. 
If patternUnits-"userSpaceOnUse", “x”, “y”, “vidth” and “height” represent values in the coordinate system that 
results from taking the current user coordinate system in place at the time vvhen the “pattern” element is 
referenced (i.e., the user coordinate system for the element referencing the “pattern” element via a “Til” or 
“stroke” property) and then applying the transform specifted by attribute “patternTransform”. 
If patternUnits-"obiectBoundingBox", the user coordinate system for attributes “x”, “y”, “vidih” and “height” is 
established using the bounding box of the element to vvhich the pattern is applied (see Obfiect bounding box 
units) and then applying the transform specifted by attribute “patternTransform”. 
If attribute “patternUnits” is not specifted, then the effect is as if a value of "obiectBoundingBox" vvere specifted. 


Animatable: yes. 


patternContentunits — "userSpaceOnUse l obiectBoundingBox" 
Defines the coordinate system for the contents of the “pattern”. Note that this attribute has no effect if attrib- 
ute “vievvBox” is specifted. 
If patternContentUnits-"userSpaceOnUse", the user coordinate system for the contents of the “pattern” element 
is the coordinate system that results from taking the current user coordinate system in place at the time 
vvhen the “pattern” element is referenced (i.e., the user coordinate system for the element referencing the 
“pattern” element via a “fill” or “stroke” property) and then applying the transform specifted by attribute “pat- 
ternTransform”. 
If patternContentUnits-"obiectBoundingBox", the user coordinate system for the contents of the “pattern” ele- 
ment is established using the bounding box of the element to vvhich the pattern is applied (see Obiect bound- 
ing box units) and then applying the transform specifted by attribute “patternTransform”. 
If attribute “patternContentUnits” is not specifted, then the effect is as if a value of "userSpaceOnUse" vvere spe- 
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cifled. 
Animatable: yes. 


patternTransform £ "-transform-list-" 
Contains the definition of an optional additional transformation from the pattern coordinate system onto the 
target coordinate system (i.e., "userSpaceOnUse" or "obiectBoundingBox"). This allovvs for things such as skevv- 
ing the pattern tiles. This additional transformation matrix is post-multiplied to (i.e., inserted to the right 
of) any previously defined transformations, including the implicit transformation necessary to convert from 
obiect bounding box units to user space. 
If attribute “patternTransform” is not specifted, then the effect is as if an identity transform vvere specifted. 
Animatable: yes. 


x — "-coordinate-" 
“x”, “y,, “vidth” and “height” indicate hovv the pattern tiles are placed and spaced. These attributes represent 
coordinates and values in the coordinate space specifted by the combination of attributes “patternUnits” and 
“patternTransform”. 
If the attribute is not specifted, the effect is as if a value of zero vvere specifted. 
Animatable: yes. 


y — "-coordinate-" 
See “x”. 
If the attribute is not specifted, the effect is as if a value of zero vvere specifled. 


Animatable: yes. 


vidth - "-length-" 
See “x”. 
A negative value is an error (see Error processing). A value of zero disables rendering of the element (i.e., no 
paint is applied). 
If the attribute is not specifted, the effect is as if a value of zero vvere specifted. 
Animatable: yes. 


height — "-length-" 
See “x”, 
A negative value is an error (see Error processing). A value of zero disables rendering of the element (i.e., no 
paint is applied). 
If the attribute is not specifted, the effect is as if a value of zero vvere specifted. 
Animatable: yes. 


xlink:href - "-iri-" 
An TRI reference to a different “pattern” element vvithin the current SVG document fragment. Any attributes 
vvhich are defined on the referenced element vvhich are not defined on this element are inherited by this ele- 
ment. If this element has no children, and the referenced element does (possibly due to its ovvn “xlink:href” 
attribute), then this element inherits the children from the referenced element. Inheritance can be indirect 


c 
.o 
5 
İv) 
m") 
(s 
(3) 
c 
E 
ə) 
(ə) 
o 
ad 
. 
s 





to an arbitrary level, thus, if the referenced element inherits attributes or children due to its ovvn “xlink-href” 
attribute, then the current element can inherit those attributes or children. 
Animatable: yes. 


preserveAspectRatio — "İdeferl -align- T-meetOrsSlice-1" 
See “preserveAspectRatio”. 
If the attribute is not specifted, then the effect is as if a value of xMidYMid meet vvere specifled. 
Animatable: yes. 


SVG:s user agent style sheet sets the “overflovv” property for “pattern” elements to hidden, vvhich causes a rectangu- 
lar clipping path to be created at the bounds of the pattern tile. Unless the “overflovv” property is overridden, any 
graphics vvithin the pattern vvhich goes outside of the pattern rectangle vvill be clipped. Note that if the “overflovv” 
property is set to visible the rendering behavior for the pattern is undefined. Example pattern01 belovv shovvs the 
effect of clipping to the pattern tile. 

The contents of the “pattern” are relative to a nevv coordinate system. If there is a “vievvBox” attribute, then the 
nevv coordinate system is fitted into the region defined by the “x”, “y”, “vidih”, “heighi” and “patternUnits” attributes 
on the “pattern” element using the standard rules for “vievvBox” and "preserveAspectRatio”. If there is no “vievvBox” 
attribute, then the nevv coordinate system has its origin at (x, y), vvhere x is established by the “x” attribute on the 
“pattern” element, and y is established by the “y” attribute on the “pattern” element. Thus, in the follovving example: 


cpattern x-"10" y-"10" vidth-"20" height-"20"- 
crect xe"5" ye"5" vidth-"10" height-"10"/” 
c/ patternxe 


the rectangle has its top/left located 5 units to the right and 5 units dov from the origin of the pattern tile. 

The “viev,Box” attribute introduces a supplemental transformation vvhich is applied on top of any transforma- 
tions necessary to create a nevv pattern coordinate system due to attributes “x”, “y”, “vidth”, “height” and “patternUn- 
its”. 

Properties inherit into the “pattern” element from its ancestors: properties do nof inherit from the element 
referencing the “pattern” element. 

“pattern” elements are never rendered directly: their only usage is as something that can be referenced using 
the “fil” and “stroke” properties. The “display” property does not apply to the “pattern” element: thus, “pattern” ele- 
ments are not directly rendered even if the “display” property is set to a value other than none, and “pattern” ele- 
ments are available for referencing even vvhen the “display” property on the “pattern” element or any of its ancestors 
is set to none. 

Event attributes and event listeners attached to the contents of a “pattern” element are not processed: only the 
rendering aspects of “pattern” elements are processed. 

Example pattern01 shovvs hovv to fill a rectangle by referencing a pattern paint server. Note hovv the blue 
stroke of each triangle has been eclipped at the top and the left. This is due to SVGs user agent style sheet setting 
the “overflovv” property for “pattern” elements to hidden, vvhich causes the pattern to be clipped to the bounds of 
the pattern tile. 


c?xml versionz"1.0" standalone-"no"?5 
x İDOCTYPE svg PUBLİC "-//03C//DTD SVG 1.1//EN" 
"http: / /vvv/.v/3.org/Graphics/SVG/1.1/DTD/svg11.dtd"s 


x€svg vidth-"8cm" height-"4cm" vieuvBoxz"0 0 800 400" version-"1.1" 
xmlnsz"http: / /vuv/..v/3.0T9/2000/svg"z 
edefso 
cpattern id-"TrianglePattern" patternUnits-"userSpacetünUse" 
xe"0" ye"0" vidth-"100" height-"100" 
vievBoxz"0 0 10 10" 5 
cpath de"M 0 0 L7 0 LL 3.5 7 z" fill-"red" strokez"blue" /5 
c/ patternx 
e/defsos 
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c1-- QOutline the draving area in blue --xs 
crect fill-"none" strokez"blue" 
xz"1" ye-"1" vidth-"798" height-"398"/5 


c1-- The ellipse is filled using a triangle pattern paint server 
and stroked vith black --x 
cellipse fill-"url(/TrianglePattern)" strokez"black" stroke-vidth-"5" 
cxz"400" cyz"200" rxz"350" ryz"150" /5 
x/ svg” 


Example pattern01 





13.4 DOM interfaces 


13.4.1 Interface SVGGradientElement 


The SVGGradientElement interface is a base interface used by SVGLinearGradientElement and SVGRadialGradi- 
entElement. 


interface SV6GGradientElement : SVGElement, 
SVGURTReference, 
SVGExternalResourcesRequired, 
SVöStylable, 
SVGUnitTypes ( 


// Spread Method Types 


const unsigned short SVG SPREADMETHOD UNKNOMN — 0, 
const unsigned short SVG SPREADMETHÜD PAD £ 1, 
const unsigned short SVG SPREADMETHOD REFLECT 2, 


const unsigned short SVG SPREADMETHÜUD REPEAT z 3, 


readonly attribute SVGAnimatedEnumeration gradientüUnits, 
readonly attribute SVGAnimatedTransformList gradientTransform, 
readonly attribute SVGAnimatedEnumeration spreadMethod, 

R 


Constants in group “Spread Method Types”: 


e SVG SPREADMETHOD UNKNOVVN (nsigned short) 


"The type is not one of predefined types. İt is invalid to attempt to define a nevv value of this type or to attempt 
to svvitch an existing value to this type. 
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e SVG SPREADMETHOD PAD (nsigned short) 


Corresponds to value pad". 


e SVG SPREADMETHOD REFLECT (unsigned short) 





Corresponds to value Tefleci". 


e SVG SPREADMETHOD REPFAT (unsigned short) 


Corresponds to value Tepeat". 
Attributes: 


e gradientUnits (readonly SVGAnimatedEnumeration) 


Corresponds to attribute “gradientUnits” on the given element. Takes one of the constants defined in SVGÜn- 


itTypes. 


e gradientTransform (readonly SVGAnimatedTransformList) 


Corresponds to attribute “gradientTransform” on the given element. 


e spreadMethod (readonly SVGAnimatedEnumeration) 


Corresponds to attribute “spreadMethod” on the given element. One of the Spread Method Types defined on 
this interface. 


13.4.2 Interface SVGLinearGradientElement 


"The SVGLinearGradientElement interface corresponds to the “linearGradient” element. 


interface SVGLinearGradientElement : SVGGradientElement ( 
readonly attribute SVGAnimatedLength x1, 
readonly attribute SVGAnimatedLength y1, 
readonly attribute SVGAnimatedLength x2, 
readonly attribute SVGAnimatedLength y2, 
ii 


Aftributes: 


e X1 (readonly SVGAnimatedLength) 


Corresponds to attribute “x1” on the given “linearGradient” element. 
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e y1 (readonly SVGAnimatedLength) 


Corresponds to attribute “y1” on the given “linearGradient” element. 


e X2 (readonly SVGAnimatedLength) 


Corresponds to attribute “x2” on the given “linearGradient” element. 





e y2 (readonly SVGAnimatedLength) 


Corresponds to attribute “y2” on the given “linearGradient” element. 


13.4.3 Interface SVGRadialGradientElement 


The SVGRadialGradientElement interface corresponds to the “radialGradient” element. 


interface SV6RadialGradientElement : SVGGradientElement 
readonly attribute SVGAnimatedLength cx, 
readonly attribute SVGAnimatedLength cy, 
readonly attribute SVGAnimatedLength r, 
readonly attribute SVGAnimatedLength fx, 
readonly attribute SVGAnimatedLength fy, 
R 


Attributes: 
e €X (readonly SVGAnimatedLength) 


Corresponds to attribute “ex” on the given “radialGradient” element. 


e cy (readonly SVGAnimatedLength) 


Corresponds to attribute “ey” on the given TadialGradient” element. 


e r (readonly SVGAnimatedLength) 


Corresponds to attribute “r” on the given “radialGradient” element. 


e fx (readonly SVGAnimatedLength) 


Corresponds to attribute “fx” on the given “radialGradient” element. 


e İy (readonly SVGAnimatedLengih) 
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Corresponds to attribute “fy” on the given “radialGradient” element. 


13.4.4 Interface SVGStopElement 


The SVGStopElement interface corresponds to the “stop” element. 


interface SV6StopElement : SVGElement, 
SVGStylable ( 

readonly attribute SVGAnimatedNumber offset, 

y 





Aftributes: 


e offset (readonly SVGAnimatedNumber) 


Corresponds to attribute “offset” on the given “stop” element. 


13.4.5 Interface SVGPatternElement 


The SVGPatternElement interface corresponds to the “pattern” element. 


interface SV6PatternElement : SVGElement, 
SVGURTReference, 
SVGTests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVöStylable, 
SVGFitToVievBox, 
SVGUnitTypes ( 
readonly attribute SVGAnimatedEnumeration patternünits, 
readonly attribute SVGAnimatedEnumeration patternContentünits, 
readonly attribute SVGAnimatedTransformList patternTransform, 
readonly attribute SVGAnimatedLength x, 
readonly attribute SVGAnimatedLength y, 
readonly attribute SVGAnimatedLength vidth, 
readonly attribute SVGAnimatedLength height, 
y 


Aftributes: 


e patternUnits (readonly SVGAnimatedEnumeration) 


Corresponds to attribute “patternUnits” on the given “pattern” element. Takes one of the constants defined in 
SVGünitTypes. 


e patternContentUnits (readonly SVGAnimatedEnumeration) 


Corresponds to attribute “patternContentUnits” on the given “pattern” element. Takes one of the constants 
defined in SVGÜnitTypes. 
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e pattern Transform (readonly SVGAnimatedTransformList) 


Corresponds to attribute “patternTransform” on the given “pattern” element. 


x (readonly SVGAnimatedLength) 


Corresponds to attribute “x” on the given “pattern” element. 





y (readonly SVGAnimatedLength) 


Corresponds to attribute “y” on the given “pattern” element. 


e vvidth (readonly SVGAnimatedLength) 


Corresponds to attribute “vridth” on the given “pattern” element. 


height (readonly SVGAnimatedLength) 


Corresponds to attribute “height” on the given “pattern” element. 


14 Clipping, Masking and Compositing 


Contents 
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14.1 İntroduction 


SVG supporits the follovving clipping/ masking features: 


e clipping paths, vvhich uses any combination of "path”, “text” and basic shapes to serve as the outline of a (in 
the absence of anti-aliasing) 1-bit mask, vvhere everything on the "inside" of the outline is allovved to shovv 
through but everything on the outside is masked out 

e masks, vvhich are container elements vvhich can contain graphics elements or other container elements vvhich 
define a set of graphics that is to be used as a semi-transparent mask for compositing foreground obiects into 
the current background. 


One key distinction betvveen a clipping path and a mask is that clipping paths are hard masks (i.e., the silhouette 
consists of either fully opaque pixels or fully transparent pixels, vvith the possible exception of anti-aliasing along 
the edge of the silhouette) vvhereas masks consist of an image vvhere each pixel value indicates the degree of trans- 
pareney vs. opacity. In a mask, each pixel value can range from fully transparent to fully opaque. 

SVG supports only simple alpha blending compositing (see Simple Alpha Compositing). 


14.2 Simple alpha compositing 


Graphics elements are blended into the elements already rendered on the canvas using simple alpha compositing, 


in vvhich the resulting color and opacity at any given pixel on the canvas is the result of the follovring formulas 
(all color values use premultiplied alpha): 


Er, Eg, Eb - Element color value 
Ea - Element alpha value 
Cr, Cg, Cb - Canvas color value (before blending) 
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Ca - Canvas alpha value (before blending) 
Cr", Cg", Cb" - Canvas color value (after blending) 
Ca" - Canvas alpha value (after blending) 
Ca" cz 1- (1- Fa) ” (1 - Ca) 

Cr" c (1 - Ea) ” Cr R Er 

Cg" c (1 - Ea) ” Cg 4 Eg 

Cb" z (1 - Ea) ” Cb H Eb 


"The follovving rendering properties, vvhich provide information about the color space in vvhich to perform the com- 
positing operations, apply to compositing operations: 





e “color-interpolation” 


e “color-rendering” 


14.3 Clipping paths 


14.3.1 Introduction 


"The clipping path restricts the region to vvhich paint can be applied. Conceptually, any parts of the dravving that lie 
outside of the region bounded by the currently active clipping path are not dravvn. A clipping path can be thought 
of as a mask vvherein those pixels outside the clipping path are black vvith an alpha value of zero and those pixels 
inside the clipping path are vvhite vvith an alpha value of one (vrith the possible exception of anti-aliasing along 
the edge of the silhouette). 


14.3.2 The initial clipping path 


VVhen an “svg” element is either the root element in the document or is embedded vvithin a document vvhose layout 
is determined according to the layout rules of CSS or XSL, then the user agent must establish an initial clipping 
path for the SVG document fragment. The “overflovv” and “clip” properties along vvith additional SVG user agent 
processing rules determine the initial clipping path vvhich the user agent establishes for the SVG document frag- 


ment: 


14.3.3 The “overflov” and “clip” properties 
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Value: visible 1 hidden 1 scroll 1 auto 1 inherit 

lnitial: see prose 

Applies to: elements vvhich establish a nevv vievvport, “pattern” elements and “marker” elements 
Inherited: no 

Percentages: N/A 

Media: visual 


Animatable: yes 


The “overflovv” property has the same parameter values and has the same meaning as defined in CSS2 (TCSS2), 
section 11.1.1): hovvever, the follovving additional points apply: 





e "The “overflov”” property applies to elements that establish nevv vievvports (e.g., “svg” elements), “pattern” ele- 
menis and “marker” elements. For all other elements, the property has no effect (1.e., a clipping rectangle is 
not created). 

e For those elements to vvhich the “overflovr” property can appiy, if the “overflovv” property has the value hidden 
or seroll, the effect is that a nevv clipping path in the shape of a rectangle is created. The result is equivalent 
to defining a “clipPath” element vvhose content is a “rect” element vvhich defines the equivalent rectangle, and 
then specifying the -uri” of this “clipPath” element on the “clip-path” property for the given element. 

e If the “overflovv” property has a value other than hidden or seroll, the property has no effect (i.e., a clipping 
rectangle is not created). 

e  VVithin SVG content, the value auto is equivalent to the value visible. 

ə VVhen an outermost svg element is embedded inline vvithin a parent XML grammar vvhich uses CSS layout 
(İCSS2), chapter 9) or XSL formatting TXSLİ, if the “overflovv” property has the value hidden or seroll, then the 
user agent vvill establish an initial clipping path equal to the bounds of the initial vievvport: othervvise, the 
initial clipping path is set according to the clipping rules as defined in CSS2 (TCSS2), section 11.1.1). 

e VVhen an outermost svg element is stand-alone or embedded inline vvithin a parent XML grammar vvhich 
does not use CSS layout or XSL formatting, the “overflovv” property on the outermost svg element is ignored 
for the purposes of visual rendering and the initial clipping path is set to the bounds of the initial vievvport. 

e "The initial value for “overflovv” as defined in TCSS2-overflovv1 is "isible, and this applies also to the root “svg” 
element: hovvever, for child elements of an SVG document, SVG:s user agent style sheet overrides this initial 
value and sets the “overflovr” property on elements that establish nevv vievvports (e.g., “svg” elements), “pattern” 
elements and “marker” elements to the value "hidden" 


As a result of the above, the default behavior of SVG user agents is to establish a clipping path to the bounds of 
the initial vievvport and to establish a nevv clipping path for each element vvhich establishes a nevv vievvport and 
each “pattern” and “marker” element. 

For related information, see Clip to vievvport vs. clip to “vievvBox”. 
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Value: xshapes İ auto 1 inherit 
lnitial: auto 
Applies to: elements vvhich establish a nevv vievvport, “pattern” elements and “marker” elements 


Inherited: no 
Percentages: N/A 
Media: visual 


Animatable: yes 


"The “clip” property has the same parameter values as defined in CSS2 (İCSS2l, section 11.1.2). Unitless values, 
vvhich indicate current user coordinates, are permitted on the coordinate values on the -shapes. The value of auto 
defines a clipping path along the bounds of the vievvport created by the given element. 


14.3.4 Clip to vievvport vs. clip to “vievvBox” 


İt is important to note that initial values for the “overflovr” and “clip” properties and the user agent style sheet vvill 
result in an initial clipping path that is set to the bounds of the initial vievvport. VVhen attributes “vievvBox” and 
“preserveAspectRatio” attributes are specifted, it is sometime desirable that the clipping path be set to the bounds 
of the “vievvBox” instead of the vievvport (or reference rectangle, in the case of “marker” and “pattern” elements), 
particularly vvhen “preserveAspectRatio” specifies uniform scaling and the aspect ratio of the “vievvBox” does not 
match the aspect ratio of the vievvport. 

To set the initial clipping path to the bounds of the “vievrBox”, set the bounds of “clip” property to the same 
rectangle as specified on the “viev/Box” attribute. (Note that the parameters do not match. “clip” takes values -top”, 
eright”,-bottoms and -lefts, vvhereas “vievvBox” takes values -min-xs, -min-y”, evvidths and -heightə.) 


14.3.5 Establishing a nevv clipping path: the “clipPath” element 


A clipping path is defined vvith a “clipPath” element. A clipping path is used/referenced using the “clip-path” prop- 
erty. 

A “clipPath” element can contain “path” elements, “text” elements, basic shapes (such as “circle”) or a “use” ele- 
ment. If a “use” element is a child of a “clipPath” element, it must directly reference “path”, “text” or basic shape 
elements. İndirecet references are an error (see Error processing). 

The ravv geometry of each child element exclusive of rendering properties such as “fil, “stroke”, “stroke-vvidth” 
vvithin a “clipPath” conceptually defines a 1-bit mask (vvith the possible exception of anti-aliasing along the edge 
of the geometry) vvhich represents the silhouette of the graphics associated vvith that element. Anything outside 
the outline of the obiect is masked out. If a child element is made invisible by “display” or “visibility” it does not 
contribute to the clipping path. V/hen the “clipPath” element contains multiple child elements, the silhouettes of 
the child elements are logically OR"d together to create a single silhouette vvhich is then used to restrict the region 
onto vvhich paint can be applied. Thus, a point is inside the clipping path if it is inside any of the children of the 
“clipPath”. 

For a given graphics element, the actual clipping path used vvill be the intersection of the clipping path spe- 


cifled by its “clip-path” property (if any) vvith any clipping paths on its ancestors, as specifted by the “clip-path” 
property on the ancestor elements, or by the “overflovv” property on ancestor elements vvhich establish a nevv vievv- 
port. Also, see the discussion of the initial clipping path.) 

A couple of notes: 
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e "The “clipPath” element itself and its child elements do nof inherit clipping paths from the ancestors of the 
“clipPath” element. 

e "Ihe “clipPath” element or any of its children can specify property “clip-path”. 
If a valid “clip-path” reference is placed on a “clipPath” element, the resulting clipping path is the intersection 
of the contents of the “clipPath” element vvith the referenced clipping path. 
If a valid “clip-path” reference is placed on one of the children of a “clipPath” element, then the given child 
element is clipped by the referenced clipping path before OR"ing the silhouette of the child element vvith the 
silhouettes of the other child elements. 

e An empty clipping path vvill completely clip avvay the element that had the “clip-path” property applied. 





Categories: “clipPath” 
None 


Content model: 
Any number of the follovving elements, in any order: 
descriptive elements 
animation elements 
shape elements 
“text” 


e , 


use 


Attributes: 
conditional processing attributes 
core attributes 
presentation attributes 
“class” 
“style” 
“externalResourcesRequired” 
“transform” 
“clipPathUnits” 


DOM Tnterfaces: 
SVGtlipPathElement 


Attribute definitions: 


clipPathünits — "userSpaceOnUse l obiectBoundingBox" 
Defines the coordinate system for the contents of the “clipPath”. 
If clipPathUnits- "userSpaceOnUse", the contents of the “clipPath” represent values in the current user coordin- 
ate system in place at the time vvhen the “clipPath” element is referenced (i.e., the user coordinate system for 
the element referencing the “clipPath” element via the “clip-path” property). 
If clipPathUnits-"obiectBoundingBox", then the user coordinate system for the contents of the “clipPath” ele- 
ment is established using the bounding box of the element to vvhich the clipping path is applied (see Obiect 
bounding box units). 
If attribute “clipPathUnits” is not specifted, then the effect is as if a value of "userSpaceOnUse" vvere specifted. 
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Animatable: yes. 





Properties inherit into the “clipPath” element from its ancestors, properties do not inherit from the element refer- 
encing the “clipPath” element. 

“clipPath” elements are never rendered directly: their only usage is as something that can be referenced using 
the “clip-path” property. The “display” property does not appİy to the “clipPath” element: thus, “clipPath” elements are 
not directly rendered even if the “display” property is set to a value other than none, and “clipPath” elements are 


available for referencing even vvhen the “display” property on the “clipPath” element or any of its ancestors is set to 


none. 
Value: cfunciris İ none 1 inherit 
lnitial: none 


Applies to: Ccontainer elements, graphics elements and “clipPath” 


Inherited: no 
Percentages: N/A 
Media: visual 


Animatable: yes 


efunciri” 
An TRİ reference to another graphical obfect vvithin the same SVG document fragment vvhich vvill be used as 
the clipping path. If the IRI reference is not valid (e.g it points to an obiect that doesn"t exist or the obiect is 
not a “clipPath” element) the “clip-path” property must be treated as if it hadn"t been specifted. 


Value: nonzero İl evenodd l inherit 
lnitial: nonzero 
Applies to: graphics elements vvithin a “clipPath” element 
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inherited: yes 
Percentages: N/A 
Media: visual 


Animatable: yes 


nonzero 
See deseription of “fill-rule” property. 
evenodd 


See deseription of “fill-rule” property. 





The “clip-rule” property only applies to graphics elements that are contained vvithin a “clipPath” element. The fol- 
lovving fragment of code vvill cause an evenodd clipping rule to be applied to the clipping path because “clip-rule” 
is specified on the “path” element that defines the clipping shape: 


xg clip-rulez"nonzero"x 
eclipPath id-"MyClip"” 


xpath de"..." clip-rulez"evenodd" /s 
e/clipPath” 
cerect clip-path-"ur1(£MyClip)" ... /” 
x/gz 


vvhereas the follovving fragment of code vvill nof cause an evenodd clipping rule to be applied because the “clip- 
rule” is specified on the referencing element, not on the obfect defining the clipping shape: 


xg clip-rulez"nonzero"x 
eclipPath id-"MyClip"” 


xpath de"..." /s 
e/clipPath” 
crect clip-path-"url(£FMyClip)" clip-rulez"evenodd" ... /s 


c/gz 
14.3.6 Clipping paths, geometry, and pointer events 


A clipping path is conceptually equivalent to a custom vievvport for the referencing element. Thus, it affects the 
rendering of an element, but not the elements inherent geometry. The bounding box of a clipped element (that is, 
an element vvhich references a “clipPath” element via a “clip-path” property, or a child of the referencing element) 
must remain the same as if it vvere not clipped. 

By default, pointer-events must not be dispatched on the clipped (non-visible) regions of a shape. For ex- 
ample, a circle vvith a radius of 10 vvhich is clipped to a circle vvith a radius of 5 vvill not receive "click" events 
outside the smaller radius. Later versions of SVG may define nevv properties to enable fine-grained control over 
the interactions betvveen hit testing and clipping. 
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14.4 Masking 


In SVG, you can specify that any other graphics obyect or “g” element can be used as an alpha mask for compositing 
the current obiect into the background. 

A mask is defined vvith a “mask” element. A mask is used/referenced using the “mask” property. 

A “mask” can contain any graphical elements or container elements such as a “g”. 

İt is an error if the “mask” property references a non-existent obiect or if the referenced obieet is not a “mask” 
element (see Error Processing). 

The effect is as if the child elements of the “mask” are rendered into an offscreen image vvhich has been ini- 
tialized to transparent black. Any graphical obfect vvhich uses/references the given “mask” element vvill be painted 
onto the background through the mask, thus completely or partially masking out parts of the graphical obiect. 

For any graphics obiect that is used as a mask, the mask value at any point is computed from the color chan- 
nel values and alpha channel value as follovvs. First a luminance value is computed from the color channel values: 


e If the computed value of “color-interpolation” on the “mask” element is linearRGB, first convert the original 
image color values (potentially in the sRGB color space) to the linear RGB color space (see Rendering prop- 
erties). Then, using non-premultiplied linear RGB color values, apply the luminance-to-alpha coefficients (as 
defined in the “feColorMatrix” filter primitive) to convert the linear RGB color values to linear luminance val- 
ues, 

e If the computed value of “color-interpolation” on the “mask” element is sRGB then the luminance value is cal- 
culated by taking the non-premultiplied RGB color values, applying the luminance-to-alpha coefficients (as 
defined in the “feColorMatrix” filter primitive) to convert the RGB color values to luminance values. 


Finally if the graphics obfect also includes an alpha channel, then the computed luminance value is multiplied by 
the corresponding alpha value to produce the mask value. 

For a four-channel RGBA graphics obfect that is used as a mask, both the color channels and the alpha chan- 
nel of the mask contribute to the masking operation. The alpha mask that is used to composite the current obyect 
into the background represents the product of the luminance of the color channels (see previous paragraph) and 
the alpha channel from the mask. 

For a three-channel RGB graphics obfect that is used as a mask (e.g., vvhen referencing a 3-channel image 
file), the effect is as if the obfect vvere converted into a 4-channel RGBA image vvith the alpha channel uniformly 
set to 1. 

For a single-channel image that is used as a mask (e.g., vrhen referencing a 1-channel grayscale image file), 
the effect is as if the obfect vvere converted into a 4-channel RGBA image, vvhere the single channel from the ref- 
erenced obiect is used to compute the three color channels and the alpha channel is uniformly set to 1. Note that 
vvhen referencing a grayscale image file, the transfer curve relating the encoded grayscale values to linear light 
values must be taken into account vvhen computing the color channels. 

The effect of a mask is identical to vvhat vvould have happened if there vvere no mask but instead the alpha 
channel of the given obyect vvere multiplied vvith the mask"s resulting alpha values (i.e., the product of the mask"s 
luminance from its color channels multiplied by the mask"s alpha channel). 

Note that SVG Tath”s, shapes (e.g., “circle”) and “text” are all treated as four-channel RGBA images for the 


purposes of masking operations. 


Example mask(1 uses an image to mask a rectangle. 


c?xml versione"1.0" standalonez"no"?x5 
€IDOCTYPE svg PUBLİC "-//N3C//DTD SVG 1.1//EN" 
"http: / /uu/v .v3..org/Graphics/SVG/1.1/DTD/svg11.dtd"x 
x€svg vidth-"8cm" height-"3cm" vieuvBoxz"0 0 800 300" version-"1.1" 
xmlnse"http: / /uvv .vV3.0T9/2000/svg" xmlns:xlinke"http:/ /vuv/.v3.0rg/1999/xl1ink"s 
cdescsExample mask01 - blue text masked vith gradient against red background 
s/desc- 
edefsə 
elinearGradient id-"Gradient" gradientUnits-"userSpacetnUse" 
x1-"0" yl1-"0" x2-"800" y2-"0"5 
€stop offsete"80" stop-colore"uhite" stop-opacitye"0" /- 
e€stop offsetz"1" stop-color-"uhite" stop-opacitye"1" /s 
e/linearGradient- 
cmask id-"Mask" masküUnits-"userSpacetnUse" 
ye"0" vidth-"800" height-"300"5 
crect xe"0" y-"0" vidth-"800" height-"300" fill-"url(£Gradient)" /s 
c/mask” 
etext ide"Text" xe"400" y-"200" 
font-family-"Verdana" font-sizez"100" text-anchor-"middle" x 
Masked text 
c/text” 
s/defso 
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c1-- Drav a pale red rectangle in the background --5 
crect xe"0" y-"0" vidth-"800" height-"300" fill-"EFF8080" /5 


c1-- Drav the text string tvice. First, filled blue, vith the mask applied. 
Second, outlined in black vithout the mask. --x 
suse xlink:hrefe"fYText" fill-"blue" maske"ur1(£Mask)" /s 
cuse xlink:href-"HText" fill-"none" strokez"black" stroke-vidthe"2" /s 
s/ svg” 


Example mask01 





Categories: “mask” 
Container element 


Content model: 
Any number of the follovving elements, in any order: 
animation elements 
descriptive elements 
shape elements 
structural elements 
gradient elements 
. 
“altGiyphDef” 


“clipPath” 


“color-profile” 
“cursor” 
“filter” 

“font” 


“font-face” 
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“ToreignObiect” 
“image” 
“marker” 
“mask” 
“pattern” 
“script” 

“style” 

“svvitch” 

“text” 





“vievv” 
Attributes: 
conditional processing attributes 
core attributes 
presentation attributes 
“class” 
“style” 
“externalResourcesRequired” 


oz 


x 


xəs 


y 
“vvidth” 
“height” 
“maskÜnits” 


“maskContentUnits” 


DOM Interfaces: 
SVGMaskElement 


Attribute definitions: 


maskünits — "userSpaceOnUse l obiectBoundingBox" 
Defines the coordinate system for attributes “x”, "y”, “vvidth” and “height”. 
If maskUnits-"userSpaceOnUse", “x”, “y”, “vridth” and “height” represent values in the current user coordinate 
system in place at the time vvhen the “mask” element is referenced (i.e., the user coordinate system for the 
element referencing the “mask” element via the “mask” property). 


du abi s 


If maskUnits-"obiectBoundingBox", “x”, “y”, “vidth” and “height” represent fractions or percentages of the 


bounding box of the element to vvhich the mask is applied. (See Obiect bounding box units.) 
If attribute “maskUnits” is not specifted, then the effect is as if a value of "obiectBoundingBox" vvere specifted. 
Animatable: yes. 


maskContentunits - "userSpaceOnUse l obiectBoundingBox" 
Defines the coordinate system for the contents of the “mask”. 
If maskContentUnits-"userSpaceOnUse", the user coordinate system for the contents of the “mask” element is 
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the current user coordinate system in place at the time vvhen the “mask” element is referenced (i.e., the user 
coordinate system for the element referencing the “mask” element via the “mask” property). 

If maskContentUnits-"obiectBoundingBox", the user coordinate system for the contents of the “mask” is estab- 
lished using the bounding box of the element to vvhich the mask is applied. (See Obfect bounding box units.) 
If attribute “maskContentUnits” is not specifted, then the effect is as if a value of "userSpaceOnUse" vvere spe- 
cifled. 

Animatable: yes. 





x — "-ccoordinates" 
The x-axis coordinate of one corner of the rectangle for the largest possible offscreen buffer. Note that the 
clipping path used to render any graphics vvithin the mask vvill consist of the intersection of the current clip- 
ping path associated vvith the given obiect and the rectangle defined by “x”, “y,, “vidih” and “height”. 
If the attribute is not specifted, the effect is as if a value of "-1077 vvere specifted. 
Animatable: yes. 


y — "-coordinates-" 
The y-axis coordinate of one corner of the rectangle for the largest possible offsecreen buffer. 
If the attribute is not specifted, the effect is as if a value of "-1077" vvere specifted. 
Animatable: yes. 


vidth - "-length-" 
"The vvidth of the largest possible offsecreen buffer. Note that the clipping path used to render any graphics 
vvithin the mask vvill consist of the intersection of the current clipping path associated vvith the given obfect 
and the rectangle defined by “x”, "y”, “vvidth” and “height”. 
A negative value is an error (see Error processing). A value of zero disables rendering of the element. 
If the attribute is not specifted, the effect is as if a value of "12077" vvere specifted. 
Animatable: yes. 


height — "-length-" 
The height of the largest possible offsereen buffer. 
A negative value is an error (see Error processing). A value of zero disables rendering of the element. 
If the attribute is not specifted, the effect is as if a value of "12077" vvere specifted. 
Animatable: yes. 


Properties inherit into the “mask” element from its ancestors: properties do nof inherit from the element referencing 


the “mask” element. 
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“mask” elements are never rendered directly: their only usage is as something that can be referenced using the 
“mask” property. The “opacity”, “filter” and “display” properties do not apply to the “mask” element: thus, “mask” ele- 
ments are not directly rendered even if the “display” property is set to a value other than none, and “mask” elements 
are available for referencing even vvhen the “display” property on the “mask” element or any of its ancestors is set 
to none. 

The follovving is a description of the “mask” property. 


Value: xfunciri İ none 1 inherit 

lnitial: none 

Applies to: container elements and graphics elements 
Inherited: no 

Percentages: N/A 

Media: visual 


Animatable: yes 


efunciri- 
A IRI reference to another graphical obyect vvhich vvill be used as the mask. 


14.5 Obiect and group opacity: the “opacity” property 
"There are several opacity properties vvithin SVG: 


e “fill-opacity”, vvhich speciftes the opacity of a fill operation, 

e “stroke-opacity”, vvhich speciftes the opacity of a stroking operation: 

e “stop-opacity”, vvhich speciftes the opacity of a gradient stop: and 

e “opacity”, vvhich speciftes obfect/group opacity and vvhich is described in this section. 


Except for ob/ect/group opacity (described fust belovv), all other opacity properties are involved in intermediate 
rendering operations. Obyect/group opacity can be thought of conceptually as a postprocessing operation. Concep- 
tually, after the ob?ect/ group is rendered into an RGBA offsereen image, the obfect/group opacity setting speciftes 
hovv to blend the offsereen image into the current background. 


Value: xopacity-values 1 inherit 

lnitial: 1 

Applies to: container elements (except “mask”) and graphics elements 
Inherited: no 

Percentages: N/A 

Media: visual 


Animatable: yes 
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sopacity-value- 
"The uniform opacity setting to be applied across an entire obiect, as a -numbers. Any values outside the 
range 0.0 (fully transparent) to 1.0 (fully opaque) vrill be clamped to this range. (See Clamping values vvhich 
are restricted to a particular range.) If the obfect is a container element such as a “g,, then the effect is as if 
the contents of the “g” vvere blended against the current background using a mask vvhere the value of each 
pixel of the mask is -opacity-values. (See Simple alpha compositing.) 


Example opacity01 illustrates various usage of the “opacity” property on elements and groups. 


c?xml versionz"1.0" standalonez"no"?z 
€ DOCTYPE svg PUBLİC "-//V3C//DTD SVG 1.1//EN" 
"http: / /uMuv .v3..org/Graphics/SVG/1.1/DTD/svg11.dtd"x 
s€svg vidth-"12cm" height-"3.5cm" vieuvBoxz"0 0 1200 350" 
xmlnsze"http: / /vuv/ .vV3.0T9/2000/svg" versionz"1.1"2 
cdescsExample opacity01 - opacity property-c/desc” 


crect xe"1" y-"1" vidth-"1198" height-"348" 
fill-"none" strokez"blue" /s 


xc1-- Background blue rectangle --s 
crect xz"100" y-"100" vidth-"1000" height-"150" fill-"00001f" /s 


c1-- Red circles going from opaque to nearly transparent --x 
ccircle cxz"200" rz"50" fill-"red" i 
ccircle cxz"400" 50" fill-"red" 
ccircle cxz"600" 50" fill-"red" 
ccircle cxz"800" 50" fill .4" /ə 
ccircle cxz"1000" cyz"100" r-"50" fill-"red" opacitye".2" /s 





xc1-- Üpaque group, opaque circles --x 
vg opacitye"l1" 5 
ecircle cxse"182.5" cyze"250" re"50" fill-"red" opacitye"1" /” 
ecircle cxz"217.5" cyz"250" rz-"50" fill-"green" opacitye"1 
x/g” 
c1-- Group opacity: .5, opacity circles --s 
sg opacitye".,5" s 
ccircle cxs"382.5" cyz"250" rze"50" fill-"red" opacity- 
ecircle cxz"417.5" cyz"250" rz-"50" fill-"green" opacity: 
x/g” 
x1-- Üpaque group, semi-transparent green over red --x 
vg opacitye"l1" x 
ccircle cxz"582.5" cyz"250" rz"50" fill-"red" opacitye" 
ccircle cxz"617.5" cyz"250" rz-"50" fill-"green" opacity: 
x/g” 
xc1-- Üpaque group, semi-transparent red over green --x 
vg opacitye"1" 5 
ecircle cxz"817.5" cyz"250" r-"50" fill-"green" opacity: 
ccircle cxz"782.5" cyz"250" rz-"50" fill-"red" opacitye". 
x/g” 
c1-- Group opacity .5, semi-transparent green over red --x 
sg opacityze".,5" 5 
ecircle cxz"982.5" cyz"250" rze"50" fill-"red" opacitye".5" /s 
ccircle cxz"1017.5" cyz"250" r-"50" fill-"green" opacitye".5" /əs 
x/g” 
x/ svg” 
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m the example above, the top rovvr of circles have differing opacities, ranging from 1.0 to 0.2. The bottom rov il- 
İustrates five “g” elements, each of vvhich contains overlapping red and green circles, as follovvs: 





e “The first group shovvs the opaque case for reference. The group has opacity of 1, as do the circles. 

e "The second group shovvs group opacity vvhen the elements in the group are opaque. 

e "The third and fourth group shovv that opacity is not commutative. In the third group (vvhich has opacity of 1), 
a semi-transparent green circle is dravvn on top of a semi-transparent red circle, vvhereas in the fourth group 
a semi-transparent red circle is dravvn on top of a semi-transparent green circle. Note that area vvhere the 
tvvo circles intersect display different colors. The third group shovvs more green color in the intersection area, 
vvhereas the fourth group shovvs more red color. 

e "The fifth group shovvs the multiplicative effect of opacity settings. Both the circles and the group itself have 
opacity settings of .5. The result is that the portion of the red circle vvhich does not overlap vvith the green 
circle (i.e., the top/right of the red circle) vvill blend into the blue rectangle vvith accumulative opacity of .25 
(i.e., .5”.5), vvhich, after blending into the blue rectangle, results in a blended color vvhich is 2577 red and 7572 
blue. 


14.6 DOM interfaces 


14.6.1 Interface SVGClipPathElement 


The SVGClipPathElement interface corresponds to the “clipPath” element. 


interface SV6ClipPathElement : SVGElement, 
SV6GTests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVGStylable, 
SVGTransformable, 
SVGUnitTypes ( 

readonly attribute SVGAnimatedEnumeration clipPathunits, 

R 


Aftributes: 


e clipPathUnits (readonly SVGAnimatedEnumeration) 


Corresponds to attribute “clipPathUnits” on the given “clipPath” element. Takes one of the constants defined 
in SVGÜnitTypes. 
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14.6.2 Interface SVGMaskElement 


The SVGMaskElement interface corresponds to the “mask” element. 


interface SV6MaskElement : SVGElement, 
SV6Tests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVGStylable, 
SVGUnitTypes ( 
readonly attribute SVGAnimatedEnumeration maskünits, 
readonly attribute SVGAnimatedEnumeration maskContentüUnits, 
readonly attribute SVGAnimatedLength x, 
readonly attribute SVGAnimatedLength y, 
readonly attribute SVGAnimatedLength vidth, 
readonly attribute SVGAnimatedLength height, 
y 





Aftributes: 


e maskÜnits (readonly SVGAnimatedEnumeration) 


Corresponds to attribute “maskUnits” on the given “mask” element. Takes one of the constants defined in 
SVGünitTypes. 


e maskContentUnits (readonly SVGAnimatedEnumeration) 


Corresponds to attribute “maskContentUnits” on the given “mask” element. Takes one of the constants defined 
in SVGÜnitTypes. 


x (readonly SVGAnimatedLength) 


Corresponds to attribute “x” on the given “mask” element. 


y (readonly SVGAnimatedLength) 


Corresponds to attribute “y” on the given “mask” element. 


e vvidth (readonly SVGAnimatedLength) 


Corresponds to attribute “vvidih” on the given “mask” element. 


e height (readonly SVGAnimatedLength) 


Corresponds to attribute “height” on the given “mask” element. 
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15 Filter Effects 


Contents 
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15.1 mtroduction 

15.2 An example 

15.3 The “filter” element 

15.4 The “filter” property 

15.5 Filter effects region 

15.6 Accessing the background image 
15.7 Filter primitives overvievv 





15.7.1 Overvievv 
15.7.2 Common attributes 
15.7.3 Filter primitive subregion 
15.8 Light source elements and properties 
15.8.1 İntroduction 
15.8.2 Light source “feDistantLight” 
15.8.3 Light source “fePointLighi” 
15.8.4 Light source “feSpotLighi” 
15.8.5 The “lighting-color” property 
15.9 Filter primitive “feBlend” 
15.10 Filter primitive “feColorMatrix” 
15.11 Filter primitive “feComponentTransfer” 
15.12 Filter primitive “feComposite” 
15.13 Filter primitive “feConvolveMatrix” 
15.14 Filter primitive “feDiffuseLighting” 
15.15 Filter primitive “feDisplacementMap” 
15.16 Filter primitive “feFlood” 
15.17 Filter primitive “feGaussianBlur” 
15.18 Filter primitive “felmage” 
15.19 Filter primitive “feMerge” 
15.20 Filter primitive “feMorphology” 
15.21 Filter primitive “feOffset” 
15.22 Filter primitive “feSpecularLighting” 
15.23 Filter primitive “feTile” 
15.24 Filter primitive “feTurbulence” 
15.25 DOM interfaces 
15.25.1 Interface SVGFilterElement 
15.25.2 Interface SVGFilterPrimitiveStandardAttributes 
15.25.3 Interface SVGFEBlendElement 


15.25.4 Interface SVGFEColorMatrixElement 
15.25.5 Interface SVGFEComponentTransferElement 
15.25.6 Interface SVGComponentTransferFunctionElement 
15.25.7 Interface SVGFEFuncRElement 

15.25.8 Interface SVGFEFunceGElement 

15.25.9 Interface SVGFEFuncBElement 

15.25.10 Interface SVGFEFuncAElement 

15.25.11 Interface SVGFECompositeElement 
15.25.12 Interface SVGFEConvolveMatrixElement 
15.25.13 Interface SVGFEDiffuseLightingElement 
15.25.14 Interface SVGFEDistantLightElement 
15.25.15 Interface SVGFEPointLightElement 
15.25.16 Interface SVGFESpotLightElement 

15.25.17 Interface SVGFEDisplacementMapElement 
15.25.18 Interface SVGFEFloodElement 

15.25.19 Interface SVGFEGaussianBlurElement 
15.25.20 Interface SVGFElmageElement 

15.25.21 Interface SVGFEMergeElement 

15.25.22 Interface SVGFEMergeNodeElement 
15.25.23 Interface SVGFEMorphologyElement 
15.25.24 Interface SVGFEOffsetElement 

15.25.25 Interface SVGFESpecularLightingElement 
15.25.26 Interface SVGFETileElement 

15.25.27 Interface SVGFETurbulenceElement 
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15.1 İntroduction 


"This chapter describes SVG"s declarative filter effects feature set, vvhich vvhen combined vvith the 2D povver of SVG 
can describe much of the common artvvork on the VVeb in such a vvay that client-side generation and alteration can 
be performed easily. In addition, the ability to apply filter effects to SVG graphics elements and container elements 
helps to maintain the semantic structure of the document, instead of resorting to images vvhich aside from gener- 
ally being a fixed resolution tend to obscure the original semantics of the elements they replace. This is especially 
true for effects applied to text. 

A filter effect consists of a series of graphics operations that are applied to a given source graphic to produce 
a modifted graphical result. The result of the filter effect is rendered to the target device instead of the original 
source graphic. The follovving illustrates the process: 


Hb mb). İz 


Original source graphic Result of filter effect 
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Filter effects are defined by “filter” elements. To apply a filter effect to a graphics element or a container element, 
you set the value of the “filter” property on the given element such that it references the filter effect. 

Each “filter” element contains a set of filter primitives as its children. EFach filter primitive performs a single 
fundamental graphical operation (e.g., a blur or a lighting effect) on one or more inputs, producing a graphical 
result. Because most of the filter primitives represent some form of image processing, in most cases the output 
from a filter primitive is a single RGBA image. 

The original source graphic or the result from a filter primitive can be used as input into one or more other 
filter primitives. A common application is to use the source graphic multiple times. For example, a simple filter 
could replace one graphic by tvvo by adding a black copy of original source graphic offset to create a drop shadovv. 
In effect, there are novv tvvo layers of graphics, both vvith the same original source graphics. 

VVhen applied to container elements such as “g”, the “filter” property applies to the contents of the group as 
a vrhole. The group/s children do not render to the screen directly, instead, the graphics commands necessary to 
render the children are stored temporarily. Typically, the graphics commands are executed as part of the process- 
ing of the referenced “filter” element via use of the keyvvords SourceGraphic or SourceAlpha. Filter effects can be 
applied to container elements vvith no content (e.g., an empty “g” element), in vvhich case the SourceGraphic or 
SourceAlpha consist of a transparent black rectangle that is the size of the filter effects region. 

Sometimes filter primitives result in undefined pixels. For example, filter primitive “feOffset” can shift an im- 
age dovvn and to the right, leaving undefined pixels at the top and left. In these cases, the undefined pixels are set 
to transparent black. 


15.2 An example 


"The follovving shovvs an example of a filter effect. 
Example filters01 - introducing filter effects. 


c?xml versionz"1.0"25 
x DOCTYPE svg PUBLİC "-//V/3C/ /DTD SVG 1.1//EN" 
"http: //vvv .v3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
€svg vidthe"7.5cm" height-"5cm" vievBoxz"0 0 200 120" 
xmlnse"http: / /uvv .vV3.o0rg/2000/svg" versionze"1.1"5 
etitlesExample filters01.svg - introducing filter effectsc/titles 
edescsAn example vhich combines multiple filter primitives 
to produce a 3D lighting effect on a graphic consisting 
of the string "SVG" sitting on top of oval filled in red 
and surrounded by an oval outlined in red.-/desc” 
edefsəs 
efilter id-"MyFilter" filterUnits-"userSpaceOnUse" xze"0" yz"0" vidth-"200" height-"120"5 
efeGaussianBlur inz"SourceAlpha" stdDeviationz"4" resulte"blur"/s 
cfe0ffset ine"blur" dxe"4" dye"4" resulte"offsetBlur"/5 
efeSpecularLighting inze"blur" surfaceScalez"5" specularConstante".75" 
specularExponente"20" lighting-colorz"ibbbbbb" 
resulte"spec0ut"z 
efePointLight xz"-5000" y-"-10000" z-"20000"/5 
c/feSpecularLighting” 
cfeComposite in-"spec0ut" in2-"SourceAlpha" operatorze"in" result-e"specOut"/x5 
efeComposite i SourceGraphic" in2-"specOut" operatore"arithmetic" 
kl-"0" k2e"1" k3z"1" k4-"0" resulte"litPaint"/” 





efeMergex 
eTeMergeNode in-"offsetBlur"/z 
efeMergeNode in-"litPaint"/” 
c/ feMergex 
e/filter- 
xc/defs- 
xrect xe"1" ye"1" vidth-"198" height-"118" fill-"Y888888" strokez"blue" /x 
eg filter-"ur1(£MyFilter)" s 
cg- 


epath fill-"none" strokez"2D90000" stroke-vidth-"10" 
d-"M50,90 C0,90 0,30 50,30 L150,30 (200, 30 200,90 150,90 z" /5 
cpath fill-"2D90000" 
d-"M60, 80 C30,80 30,40 60,40 L140,40 (C170,40 170,80 140,80 z" /5 
eg fill-"İFFFFFF" strokeze"black" font-sizez"45" font-family-"Verdana" x 
etext xz"52" yz"76":SV6G-/text- 
x/g” 
x/g” 
x/g” 
s/ svg” 
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Example filters01 





"The filter effect used in the example above is repeated here vvith reference numbers in the left column before each 
of the six filter primitives: 


efilter id-"MyFilter" filterUnits-"userSpaceOnUse" xz"0" yz"0" vidth-"200" height-"120"- 
edesc-Produces a 3D lighting effect.-/desc” 


1 efeGaussianBlur ine"SourceAlpha" stdDeviationze"4" resulte"blur"/5 

2 cfeOffset ine"blur" dxe"4" dye"4" resulte"offsetBlur"/x 

3 efeSpecularLighting ine"blur" surfaceScaleze"5" specularConstante".75" 
specularExponente"20" lighting-color-e"söbbbbbb" 
resulte"spectut"s 

cfePointLight xe"-5000" yz"-10000" z-"20000"/5 
c/ feSpecularLighting” 
4 efeComposite in-"specOut" in2-"SourceAlpha" operatore"in" resulte"spec0ut"/s 
5 efeComposite in-"SourceGraphic" in2-"specOut" operatorze"arithmetic" 
klze"0" k2e"1" k3z"l1" k4-"0" resulte"litPaint"/s 
6 cTeMergex 


efeMergeNode inz"offsetBlur"/” 
efeMergeNode inze"litPaint"/s 
ce/ TeMergexz 
e/filter- 


The follovving pictures shovv the intermediate image results from each of the six filter elements: 


Source graphic After filter primitive 1 After filter primitive 2 After filter primitive 3 


mama 


After filter primitive 4 After filter primitive 5 After filter primitive 6 
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1. Filter primitive “feGaussianBlur” takes input SourceAlpha, vvhich is the alpha channel of the source graphic. 
"The result is stored in a temporary buffer named "blur". Note that "blur" is used as input to both filter primit- 
ives 2 and 3. 

2. Filter primitive “feOfiset” takes buffer "blur", shifts the result in a positive direction in both x and y, and creates 
a nevv buffer named "offsetBlur". The effect is that of a drop shadovv. 

3. Filter primitive “feSpecularLighting”, uses buffer "blur" as a model of a surface elevation and generates a light- 
ing effect from a single point source. The result is stored in buffer "specOut", 

4. Filter primitive “feComposite” masks out the result of filter primitive 3 by the original source graphics alpha 
channel so that the intermediate result is no bigger than the original source graphic. 

5. Filter primitive “feComposite” composites the result of the specular lighting vvith the original source graphic. 
Filter primitive “feMerge” composites tvvo layers together. The lovver layer consists of the drop shadovv result 
from filter primitive 2. The upper layer consists of the specular lighting result from filter primitive 5. 


15.3 The “filter” element 


"The description of the “filter” element follovvs: 


Categories: “filter” 
None 


Content model: 
Any number of the follovving elements, in any order: 
descriptive elements 
filter primitive elements 
“animate” 


“set” 
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Attributes: 
core attributes 
presentation attributes 
xlink attributes 
“class” 
“style” 


. 


“externalResourcesRequired 


.. 


x 


pə 


y 
“vidth” 
“height” 
“filterRes” 
“filterUnits” 
“primitiveUnits” 
“xlink:href” 

DOM Tnterfaces: 
SVGFilterElement 


Attribute definitions: 


filterUnits - "userSpaceOnUse 1 obiectBoundingBox" 
See Filter effects region. 


primitiveUnits - "userSpaceOnUse 1 obiectBoundingBox" 
Specifies the coordinate system for the various length values vvithin the filter primitives and for the attributes 
that define the filter primitive subregion. 
If primitiveUnits-"userSpaceOnUse", any length values vvithin the filter definitions represent values in the 
current user coordinate system in place at the time vvhen the “filter” element is referenced (i.e., the user co- 
ordinate system for the element referencing the “filter” element via a “filter” property). 
If primitiveUnits-"obiectBoundingBox", then any length values vvithin the filter definitions represent fractions 
or percentages of the bounding box on the referencing element (see Obfect bounding box units). Note that 
if only one number vvas specifted in a -number-optional-number” value this number is expanded out before 
the “primitiveUnits” computation takes place. 
If attribute “primitiveUnits” is not specifted, then the effect is as if a value of userSpaceOnUse vvere specifted. 
Animatable: yes. 


x c "ccoordinate-" 
See Filter effects region. 
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y c "-coordinates" 
See Filter effects region. 


vidth - "-length”" 
See Filter effects region. 


height - "-lengths" 
See Filter effects region. 


filterRes — "-number-optional-number”" 
See Filter effects region. 


xlink:href - "-iri-" 

An TRI reference to another “filter” element vvithin the current SVG document fragment. Any attributes vvhich 
are defined on the referenced “filter” element vvhich are not defined on this element are inherited by this ele- 
ment. If this element has no defined filter nodes, and the referenced element has defined filter nodes (possibly 
due to its ovvn “xlink:href” attribute), then this element inherits the filter nodes defined from the referenced 
“filter” element. Inheritance can be indirect to an arbitrary level, thus, if the referenced “filter” element inher- 
its attributes or its filter node specification due to its ovvn “xlink:href” attribute, then the current element can 
inherit those attributes or filter node specifications. 

Animatable: yes. 


Properties inherit into the “filter” element from its ancestors, properties do nof inherit from the element referencing 
the “filter” element. 

“filter” elements are never rendered directly: their only usage is as something that can be referenced using the 
“filter” property. The “display” property does not appiy to the “filter” element: thus, “filter” elements are not directly 
rendered even if the “display” property is set to a value other than none, and “filter” elements are available for ref- 
erencing even vvhen the “display” property on the “filter” element or any of its ancestors is set to none. 


15.4 The “filter” property 
"The description of the “filter” property is as follovvs: 


Value: xfunciris 1 none 1 inherit 
lnitial: none 
Applies to: container elements (except “mask”) and graphics elements 


inherited: no 
Percentages: N/A 
Media: visual 


Animatable: yes 
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efunciri” 
An Functional TRI reference to a “filter” element vvhich defines the filter effects that shall be applied to this 
element. 

none 


Do not apply any filter effects to this element. 


15.5 Filter effects region 


A “filter” element can define a region on the canvas to vvhich a given filter effect applies and can provide a resol- 
ution for any intermediate continuous tone images used to process any raster-based filter primitives. The “filter” 
element has the follovving attributes vvhich vvork together to define the filter effects region: 


“filterUnits” - Defines the coordinate system for attributes “x”, “y”, “vidih” and “height”. 

If filterUnits-"userSpaceOnUse", “x”, “y”, “vidth” and “height” represent values in the current user coordinate 
system in place at the time vvhen the “filter” is referenced (i.e., the user coordinate system for the element referen- 
cing the “filter” via a “filter” property). 

If filterUnits-"obiectiBoundingBox", then “x”, "y”, “vridth” and “height” represent fractions or percentages of the 
bounding box on the referencing element (see Obfect bounding box units). 

If attribute “filterUnits” is not specifted, then the effect is if a value of "obiectBoundingBox" vvere specifled. 

Animatable: yes. 


“x,, “y,, “vvidth” and “height” - These attributes define a rectangular region on the canvas to vvhich this filter applies. 

The amount of memory and processing time required to appİy the filter are related to the size of this rectangle 
and the “filterRes” attribute of the filter. 

The coordinate system for these attributes depends on the value for attribute “filterUnits”. 

Negative values for “vvidth” or “height” are an error (see Error processing). Zero values disable rendering of the 
element vvhich referenced the filter. 

The bounds of this rectangle act as a hard clipping region for each filter primitive included vvith a given “filter” 
element: thus, if the effect of a given filter primitive vvould extend beyond the bounds of the rectangle (this some- 
times happens vvhen using a “feGaussianBlur” filter primitive vvith a very large “stdDeviation”), parts of the effect 
vvill get clipped. 

If “x” or "y” is not specifted, the effect is as if a value of -1077 vvere specifled. 

If “vidih” or “height” is not specifted, the effect is as if a value of 1207/ vvere specifted. 

Animatable: yes. 


“filterRes” . This attribute takes the form x-pixels (Iy-pixelsl, and indicates the vvidth and height of the inter- 
mediate images in pixels. If not provided, then the user agent vvill use reasonable values to produce a high-quality 
result on the output device. 

Care should be taken vvhen assigning a non-default value to this attribute. Too small of a value may result in 
unvvanted pixelation in the result. Too large of a value may result in slovv processing and large memory usage. 
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Negative values are an error (see Error processing). Zero values disable rendering of the element vvhich ref- 
erenced the filter. 

Non-integer values are truncated, i.e rounded to the closest integer value tovvards zero. 

Animatable: yes. 


Note that both of the tvvo possible value for “filterUnits” (i.e., "obiectBoundingBox" and "userSpaceOnUse") result in a 
filter region vvhose coordinate system has its X-axis and Y-axis each parallel to the X-axis and Y-axis, respectively, 
of the user coordinate system for the element to vvhich the filter vvill be applied. 

Sometimes implementers can achieve faster performance vvhen the filter region can be mapped directly to 
device pixels: thus, for best performance on display devices, it is suggested that authors define their region such 
that SVG user agent can align the filter region pixel-for-pixel vvith the background. In particular, for best filter 
effects performance, avoid rotating or skevving the user coordinate system. Explicit values for attribute “filterRes” 
can either help or harm performance. İf “filterRes” is smaller than the automatic (i.e., default) filter resolution, then 
filter effect might have faster performance (usually at the expense of quality). If “TilterRes” is larger than the auto- 
matic (i.e., default) filter resolution, then filter effects performance vvill usually be slovver. 

İt is often necessary to provide padding space because the filter effect might impact bits slightly outside the 
tight-fitting bounding box on a given obiect. For these purposes, it is possible to provide negative percentage val- 
ues for “x” and “y,, and percentages values greater than 1007: for “vyidth” and “height”. This, for example, is vvhy the 
defaults for the filter effects region are x-"-107/" y-"-107:" vvidth-"1207" height-"1207z". 


15.6 Accessing the background image 


Tevo possible pseudo input images for filter effects are Backgroundlmage and BackgroundAlpha, vvhich each rep- 
resent an image snapshot of the canvas under the filter region at the time that the “filter” element is invoked. Back- 
groundlmage represents both the color values and alpha channel of the canvas (i.e., RGBA pixel values), vvhereas 
BackgroundAlpha represents only the alpha channel, 

Implementations of SVG user agents often vvill need to maintain supplemental background image buffers in 
order to support the Backgroundlmage and BackgroundAlpha pseudo input images. Sometimes, the background 
image buffers vvill contain an in-memory copy of the accumulated painting operations on the current canvas. 

Because in-memory image buffers can take up significant system resources, SVG content must explicitly in- 
dicate to the SVG user agent that the document needs access to the background image before Backgroundlmage 
and BackgroundAlpha pseudo input images can be used. "The property vvhich enables access to the background 
image is “enable-background”, defined belovv: 


Value: accumulate 1 nevv İ cx” eyx. cvvidthə -heightə 11 inherit 
lnitial: accumulate 

Applies to: container elements 

inherited: no 

Percentages: N/A 

Media: visual 


Animatable: no 
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“enable-background” is only applicable to container elements and specifles hovv the SVG user agents manages the 
accumulation of the background image. 
A value of nevv indicates tvvo things: 


e It enables the ability of children of the current container element to access the background image. 

e İt indicates that a nevv (i.e., initially transparent black) background image canvas is established and that (in 
effect) all children of the current container element shall be rendered into the nevv background image canvas 
in addition to being rendered onto the target device. 


A meaning of enable-background: accumulate (the initial/ default value) depends on context: 


e If an ancestor container element has a property value of enable-background: nevv, then all graphics elements 
vvithin the current container element are rendered both onto the parent container elements background im- 
age canvas and onto the target device. 

e Othervvise, there is no current background image canvas, so it is only necessary to render graphics elements 
onto the target device. (No need to render to the background image canvas.) 


If a filter effect specifies either the Backgroundlmage or the BackgroundAlpha pseudo input images and no an- 
cestor container element has a property value of enable-background: nevv, then the background image request is 
technically in error. Processing vvill proceed vvithout interruption (i.e., no error message) and a transparent black 
image shall be provided in response to the request. 

The optional -xs,-yo.,vvidths,,-heighto parameters on the nevv value are -numbers values that indicate the 
subregion of the container element"s user space vvhere access to the background image is allovved to happen. These 
parameters enable the SVG user agent potentially to allocate smaller temporary image buffers than the default 
values. Thus, the values -xs,-y?.,-vridths,-heights act as a clipping rectangle on the background image canvas. 
Negative values for -vvidths or -heights are an error (see Error processing). If more than zero but less than four 
of the values -xx,-yx.,cvridths and -heightə are specifted or if zero values are specifted for -vvidths or -heightə, 
Backgroundlmage and BackgroundAlpha are processed as if background image processing vvere not enabled. 

Assume you have an element E in the document and that E has a series of ancestors A: (its immediate parent), 
Az, etc. (Note: Ag is E.) Each ancestor Ai vvill have a corresponding temporary background image offsereen buffer 
BUFİ. The contents of the background image available to a “filter” referenced by E is defined as follovvs: 


e Find the element Ai vvith the smallest subseript i (including Ao-E) for vvhich the “enable-background” property 
has the value nevv. (Note: if there is no such ancestor element, then there is no background image available to 
E, in vvhich case a transparent black image vvill be used as E"s background image.) 

e For each Ai (from in to 1), initialize BUFi to transparent black. Render all children of Ai up to but not includ- 
ing Ai-ı into BUF). The children are painted, then filtered, clipped, masked and composited using the various 
painting, filtering, clipping, masking and obiect opacity settings on the given child. Any filter effects, mask- 
ing and group opacity that might be set on Ai do nof apply vvhen rendering the children of Ai into BUF). 
(Note that for the case of Ao-E, the graphical contents of E are not rendered into BUF: and thus are not 
part of the background image available to E. Instead, the graphical contents of E are available via the 
SourceGraphic and SourceAlpha pseudo input images.) 


e "Ihen, for each Ai (from i-1 to n-1), composite BUF: into BUFi,:. 
e "Ihe accumulated result (i.e., BUFn) represents the background image available to E. 


Example enable-background-01 illustrates the rules for background image processing. 
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c?xml versionz"1.0" standalonez"no"?x 

€ DOCTYPE svg PUBLİC "-//V3C//DTD SVG 1.1//EN" 
"http: / /vuyv/ .vV3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 

s€svg vidth-"13.5cm" height-"2.7cm" vievBox-"0 0 1350 270" 

xmlnsze"http: / /vv/ .vV3.0T9/2000/svg" versionz"1.1"2 
etitlesExample enable-background61-/titles 
edescsThis test case shovs five pictures uhich illustrate the rules 
Tor background image processing.-/desc- 


edefso 
efilter id-"ShiftBGAndBlur" 
filterUnits-"userSpaceOnUse" xze"0" y-"0" vidth-"1200" height-"400"x- 
edesc” 
This filter discards the SourceGraphic, if any, and fust produces 
a result consisting of the Backgroundlmage shifted dovn 125 units 
and then blurred. 
xe/descs 
cfe0ffset in-"Backgroundlmage" dxz"0" dyz"125" /s 
efeGaussianBlur stdDeviationze"8" /5 
e/filters 
efilter id-"ShiftBGAndBlur MithSourceGraphic" 
filterUnits-"userSpaceOnUse" xze"0" y-"0" vidth-"1200" height-"400"5 
edesc- 
This filter takes the Backgroundlmage, shifts it dovun 125 units, blurs it, 
and then renders the SourceGraphic on top of the shifted/blurred background. 
s/desc- 
cfeO0ffset in-"Backgroundlmage" dxe"0" dyz"125" /5 
efeGaussianBlur stdDeviationz"8" resulte"blur" /s 
eTeMergex 
efeMergeNode inz"blur"/s 
efeMergeNode in-"SourceGraphic"/x 
c/ feMergex 
e/filter- 
s/defsəs 








sg transform-"translate(0,0)"- 
edescsThe first picture is our reference graphic vithout filters.-/desc- 
crect xe"25" ye"25" vidth-"100" height-"100" fill-"red"/5 
vg opacitye".5"- 
cvcircle cxs"125" cyz"75" re"45" fille"green"/s 
xpolygon pointsz"160,25 160,125 240,75" fill-"blue"/s 
x/g” 
crect xe"5" y-"5" vidth-"260" height-"260" fill-"none" strokez"blue"/x 
x/g” 


s€g enable-background-"nev/" transform-"translate(270,0)"5 
edescəoThe second adds an empty "g" element vhich invokes ShiftBGAndBlur.-/desc” 
crect xe"25" ye"25" vidth-"100" height-"100" fill-"red"/5 
vg opacitye".5"- 
ecircle cxz"125" cyz"75" re"45" fill-"green"/xs 
epolygon pointsz"160,25 160,125 240,75" fill-"blue"/s 
x/g” 
eg filter-"ur1(£ShiftBGAndBlur) "/5 
crect 5" ye"5" vidth-"260" height-"260" fill-"none" strokez"blue"/x 
c/g” 





s€g enable-backgrounde"nev/" transform-"translate(540,0)"5 
edescsThe third invokes ShiftBGAndBlur on the inner group.-/desc” 
crect xe"25" y-"25" vidth-"100" height-"100" fill-"red"/5 
eg filter-"url(/ShiftBGAndBlur)" opacitye".5"- 
cvcircle cxs"125" cyz"75" re"45" fille"green"/s 
xpolygon pointse"160,25 160,125 240,75" fill-"blue"/s 
x/g” 
crect xe"5" y-"5" vidth-"260" height-"260" fill-"none" strokez"blue"/x 
x/g” 





xg enable-backgrounde"nev" transform-"translate(810,0)"- 
edescsThe fourth invokes ShiftBGAndBlur on the triangle.-/desc” 
xrect xe"25" y-"25" vidth-"100" height-"100" fill-"red"/5 


vg opacitye".5"- 
ecircle cxz"125" cyze"75" re"45" fill-"green"/xs 
€polygon pointsze"160,25 160,125 240,75" fille"blue" 
filter-"ur1(£ShiftBGAndBlur) "/5 
x/g” 
crect xe"5" ye"5" vidth-"260" height-"260" fill-"none" strokez"blue"/x 
x/g” 
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€g enable-background-"nev/" transform-"translate(1080,0)"5 
edescsThe fifth invokes ShiftBGAndBlur MithSourceGraphic on the triangle.-/desc” 
crect xe"25" ye"25" vidth-"100" height-"100" fill-"red"/s 
vg opacitye".5"- 
ccircle cxz"125" cyze"75" re"45" fill-"green"/s 
epolygon pointsze"160,25 160,125 240,75" fille"blue" 
filter-"ur1(£ShiftBGAndBlur MithSourceGraphic)"/” 
x/g” 
crect xe"5" ye"5" vidth-"260" height-"260" fill-"none" strokez"blue"/x 
c/g” 
c/ svg” 


Example enable-background-01 





"The example above contains five parts, described as follovvs: 


1. The first set is the reference graphic. The reference graphic consists of a red rectangle follovved by a 5077 trans- 
parent “g” element. Inside the “g is a green circle that partially overlaps the rectangle and a a blue triangle 
that partially overlaps the circle. The three obiects are then outlined by a rectangle stroked vvith a thin blue 
line. No filters are applied to the reference graphic. 

2. "The second set enables background image processing and adds an empty “g” element vvhich invokes the 
ShiftBGAndBlur filter. This filter takes the current accumulated background image (i.e., the entire reference 
graphic) as input, shifts its offsereen dovvn, blurs it, and then vvrites the result to the canvas. Note that the 
offscreen for the filter is initialized to transparent black, vvhich allovvs the already rendered rectangle, circle 
and triangle to shovv through after the filter renders its ovvn result to the canvas. 

3. "Ihe third set enables background image processing and instead invokes the ShiftBGAndBlur filter on the in- 
ner “g” element. The accumulated background at the time the filter is applied contains only the red rectangle. 
Because the children of the inner “g” (i.e., the circle and triangle) are not part of the inner “g” elements back- 
ground and because ShiftBGAndBlur ignores SourceGraphic, the children of the inner “g do not appear in 
the result. 

4. "Ihe fourth set enables background image processing and invokes the ShiftBGAndBlur on the “polygon” ele- 
ment that dravvs the triangle. The accumulated background at the time the filter is applied contains the red 
rectangle plus the green circle ignoring the effect of the “opacity” property on the inner “g” element. (Note 
that the blurred green circle at the bottom does not let the red rectangle shovv through on its left side. This is 
due to ignoring the effect of the “opacity” property.) Because the triangle itself is not part of the accumulated 
background and because ShiftBGAndBlur ignores SourceGraphic, the triangle does not appear in the result. 

5. “he fifth set is the same as the fourth except that filter ShiftbGAndBlur VVithSourceGraphic is invoked in- 
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stead of ShiftBGAndBlur. ShiftbGAndBlur VVithSourceGraphic performs the same effect as ShiftBGAndBlur, 
but then renders the SourceGraphic on top of the shifted, blurred background image. İn this case, 
SourceGraphic is the blue triangle: thus, the result is the same as in the fourth case except that the blue tri- 


angle novv appears. 
15.7 Filter primitives overvievv 


15.7.1 Overvievv 


"This section describes the various filter primtives that can be assembled to achieve a particular filter effect. 

Unless othervvise stated, all image filters operate on premultiplied RGBA samples. Filters vvhich vvork more 
naturally on non-premulltiplied data (feColorMatrix and feComponentTransfer) vvill temporarily undo and redo 
premultiplication as specifted. AİI raster effect filtering operations take 1 to N input RGBA images, additional at- 
tributes as parameters, and produce a single output RGBA image. 

The RGBA result from each filter primitive vvill be clamped into the allovvable ranges for colors and opacity 
values. Thus, for example, the result from a given filter primitive vvill have any negative color values or opacity 
values adiusted up to color/opacity of zero. 

The color space in vvhich a particular filter primitive performs its operations is determined by the value of 
property “color-interpolation-filters” on the given filter primitive. A different property, “color-interpolation” determ- 
ines the color space for other color operations. Because these tvvo properties have different initial values (“color- 
interpolation-filters” has an initial value of linearRGB vvhereas “color-interpolation” has an initial value of sRGB), in 
some cases to achieve certain resulis (e.g., vvhen coordinating gradient interpolation vvith a filtering operation) it 
vvill be necessary to explicitly set “color-interpolation” to linearRGB or “color-interpolation-filters” to sRGB on partic- 
ular elements. Note that the examples belovr do not explicitly set either “color-interpolation” or “color-interpolation- 
filters”, so the initial values for these properties apply to the examples. 


15.7.2 Common attributes 
VVith the exception of the “in” attribute, all of the follovving attributes are available on all filter primitive elements: 
Attribute definitions: 


x z "ccoordinates" 
The minimum x coordinate for the subregion vvhich restricts calculation and rendering of the given filter 
primitive. See filter primitive subregion. 
Animatable: yes. 


y c "-ccoordinates" 
"The minimum y coordinate for the subregion vvhich restricts calculation and rendering of the given filter 
primitive. See filter primitive subregion. 
Animatable: yes. 


vidth - "-length”" 
"The vvidth of the subregion vvhich restricts calculation and rendering of the given filter primitive. See filter 
primitive subregion. 
A negative value is an error (see Error processing). A value of zero disables the effect of the given filter prim- 
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itive (1.e., the result is a transparent black image). 
Animatable: yes. 


height - "-lengih”" 
"The height of the subregion vvhich restricts calculation and rendering of the given filter primitive. See filter 
primitive subregion. 
A negative value is an error (see Error processing). A value of zero disables the effect of the given filter prim- 
itive (1.e., the result is a transparent black image). 
Animatable: yes. 





result — "-filter-primitive-reference-" 
Assigned name for this filter primitive. If supplied, then graphics that result from processing this filter prim- 
itive can be referenced by an “in” attribute on a subsequent filter primitive vvithin the same “Tilter” element. 
If no value is provided, the output vvill only be available for re-use as the implicit input into the next filter 
primitive if that filter primitive provides no value for its “in” attribute. 
Note that a -fi/ter-primitive-reference” is not an XML TD, instead, a -filter-primitive-reference” is only 
meaningful vvithin a given “filter” element and thus have only local scope. İt is legal for the same -fi/ter- 
primitive-reference” to appear multiple times vvithin the same “filter” element. VVhen referenced, the -/fi/ter- 
primitive-references vvill use the closest preceding filter primitive vvith the given result. 
Animatable: yes. 


in - "SourceGraphic / SourceAlpha / Backgroundlmage / BackgroundAlpha / FillPaint / StrokePaint 1 
efilter-primitive-references" 
Identiftes input for the given filter primitive. The value can be either one of six keyvvords or can be a string 
vvhich matches a previous “result” attribute value vvithin the same “filter” element. If no value is provided and 
this is the first filter primitive, then this filter primitive vvill use SourceGraphic as its input. If no value is 
provided and this is a subsequent filter primitive, then this filter primitive vvill use the result from the previ- 
ous filter primitive as its input. 


If the value for “result” appears multiple times vvithin a given “filter” element, then a reference to that result 
vvill use the closest preceding filter primitive vvith the given value for attribute “result”. Forvvard references 


to results are an error. 
Definitions for the six keyvvords: 


SourceGraphic 
"This keyvvord represents the graphics elements that vvere the original input into the “filter” element. For 
raster effects filter primitives, the graphics elements vvill be rasterized into an initially clear RGBA ras- 
ter in image space. Pixels left untouched by the original graphic vvill be left clear. The image is specifted 
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to be rendered in İlinear RGBA pixels. The alpha channel of this image captures any anti-aliasing speci- 
fied by SVG. (Since the raster is İinear, the alpha channel of this image vvill represent the exact percent 
coverage of each pixel.) 


SourceAlpha 
"This keyvvord represents the graphics elements that vvere the original input into the “filter” element. 
SourceAlpha has all of the same rules as SourceGraphic except that only the alpha channel is used. The 
input image is an RGBA image consisting of implicitly black color values for the RGB channels, but 
vrhose alpha channel is the same as SourceGraphic. İf this option is used, then some implementations 
might need to rasterize the graphics elements in order to extract the alpha channel. 


Backgroundimage 
"This keyvvord represents an image snapshot of the canvas under the filter region at the time that the 
“filter” element vvas invoked. See Accessing the background image. 


BackgroundAlpha 
Same as Backgroundlmage except only the alpha channel is used. See SourceAlpha and Accessing the 
background image. 


FillPaint 
"This keyvvord represents the value of the “fil” property on the target element for the filter effect. The 
FillPaint image has conceptually infinite extent. Frequently this image is opaque everyvvhere, but it 
might not be if the "paint" itself has alpha, as in the case of a gradient or pattern vvhich itself includes 
İransparent or semi-transparent parts. 


StrokePaint 
"This keyvvord represents the value of the “stroke” property on the target element for the filter effect. The 
StrokePaint image has conceptually infinite extent. Frequently this image is opaque everyvvhere, but it 
might not be if the "paint" itself has alpha, as in the case of a gradient or pattern vvhich itself includes 
İransparent or semi-transparent parts. 


The “in” attribute is available on all filter primitive elements that require an input. 
Animatable: yes. 


15.7.3 Filter primitive subregion 
AlI filter primitives have attributes “x”, “y”, “vidth” and “height” vvhich identify a subregion vvhich restricts calcula- 
tion and rendering of the given filter primitive. These attributes are defined according to the same rules as other 
filter primitives" coordinate and length attributes and thus represent values in the coordinate system established 
by attribute “primitiveUnits” on the “filter” element. 

“x,, “ey”, “vidth” and “heighi” default to the union (i.e., tightest fitting bounding box) of the subregions defined 
for all referenced nodes. If there are no referenced nodes (e.g., for “felmage” or “feTurbulence”), or one or more of 


the referenced nodes is a standard input (one of SourceGraphic, SourceAlpha, Backgroundlmage, BackgroundAlpha, 


FillPaint or StrokePaint), or for “feTile” (vvhich is special because its principal function is to replicate the referenced 
node in X and Y and thereby produce a usually larger result), the default subregion is 077,07/,10072,10077, vvhere as 
a special-case the percentages are relative to the dimensions of the filter region, thus making the the default filter 
primitive subregion equal to the filter region. 
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“x,, “y,, “vridih” and “height” act as a hard clip clipping rectangle on both the filter primitives input image(s) 
and the filter primitive result. 

AİI intermediate offscreens are defined to not exceed the intersection of “x”, “y”, “vvidth” and “height” vvith the 
filter region. The filter region and any of the “x”, “y”, “vvidih” and “height” subregions are to be set up such that all 
offscreens are made big enough to accommodate any pixels vvhich even partly intersect vvith either the filter re- 
gion or the x,y,vvidth,height subregions. 

“feTile” references a previous filter primitive and then stitches the tiles together based on the “x”, “y”, “vridih” 
and “height” values of the referenced filter primitive in order to fill its ovvn filter primitive subregion. 

Example primitive-subregion-01 demonstrates the effect of specifying a filter primitive subregion: 





c€svg vidth-"400" height-"400" xmlnsz"http: / /vvv .v(3.0T9/2000/svg"z 
edefss 
efilter id-"flood" xe"0" y-"0" vidth-"1005" height-"1005" primitiveUnits-"obfectBoundingBox"x 
efeFlood xze"258" yz"258" vidth-"508" height-"505" 
Tlood-colorz"green" f1ood-opacitye"0.75"/5 
e/filter- 
efilter id-"blend" primitiveUnits-"obiectBoundingBox"” 
efeBlend xz"258" yz"258" vidth-"508" height-"505" 
in2-"SourceGraphic" modez"multiply"/s 
e/filter- 
efilter id-"merge" primitiveUnits-"obiectBoundingBox"” 
cfeMerge xz"258" yz"258" vidth-"508" height-"508"5 
efeMergeNode in-z"SourceGraphic"/s 
efeMergeNode in-"FillPaint"/x 
c/ feMergex 
e/filter- 
s/defss 








sg fill-"none" strokeze"blue" stroke-vidthe"4"5 
crect vidth-"200" height-"200"/5 
eline x2-"200" y2-"200"/5 
eline x1-"200" y2-"200"/5 
x/g” 
ecircle fill-"green" filter-"url(/T1o0od)" cxz"100" cyz"100" r-"90"/5 


s€g transform-"translate(200 0)"5 
eg fill-"none" strokeze"blue" stroke-vidth-"4"5 
crect vidth-"200" height-"200"/5 
eline x2-"200" y2-"200"/5 
eline x1-"200" y2-"200"/5 
x/g” 
ecircle fill-"green" filter-"url(£blend)" cxz"100" cyz"100" r-"90"/5 
x/g” 


s€g transform-"translate(0 200)"5 
eg fill-"none" strokeze"blue" stroke-vidth-"4"5 
crect vidth-"200" height-"200"/5 
eline x2-"200" y2-"200"/5 
eline x1-"200" y2-"200"/5 
x/g” 
ecircle fill-"green" fill-opacitye"0.5" filter-"url(£merge)" cxz"100" cyz"100" r-"90"/5 
x/g” 
s/ svg” 
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Example primitive-subregion-01 





In the example above there are three rects that each have a cross and a circle in them. The circle element in each 
one has a different filter applied, but vvith the same filter primitive subregion. The filter output should be limited 
to the filter primitive subregion, so you should never see the circles themselves, fust the rects that make up the 


filter primitive subregion. 


e "Ihe upper left rect shovvs an “TeFlood” vvith flood-opacity-"757:" so the cross should be visible through the 
green rect in the middle. 

e "The lovver left rect shovvs an “feMerge” that merges SourceGraphic vvith FillPaint. Since the circle has fill-opa- 
city-"0.5" it vvill also be transparent so that the cross is visible through the green rect in the middle. 

e "The upper right rect shovvs an “feBlend” that has mode-"multiply". Since the circle in this case isn"t transparent 
the result is totally opaque. The rect should be dark green and the cross should not be visible through it. 


15.8 Light source elements and properties 


15.8.1 Introduction 
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"The follovving sections define the elements that define a light source, “feDistantLight”, “fePointLight” and “feS- 
potLight”, and property “lighting-color”, vvhich defines the color of the light. 


15.8.2 Light source “feDistantLight 


Categories: “TeDistantLight” 


Light source element 





Content model: 
Any number of the follovving elements, in any order: 
“animate” 
“set” 
Attributes: 
core attributes 
“azimuth” 


“elevation” 


DOM TInterfaces: 
SVGFEDistantLightElement 


Attribute definitions: 


azimuth — "-numbers" 
Direction angle for the light source on the XY plane (clockvvise), in degrees from the x axis. 
If the attribute is not specifted, then the effect is as if a value of 0 vvere specifted. 
Animatable: yes. 


elevation - "-numbers" 
Direction angle for the light source from the XY plane tovvards the z axis, in degrees. Note the positive Z- 
axis points tovvards the vievver of the content. 
If the attribute is not specifted, then the effect is as if a value of 0 vvere specifted. 
Animatable: yes. 


"The follovving diagram illustrates the angles vvhich “azimuth” and “elevation” represent in an XYZ coordinate sys- 


tem. 
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— Azimuth 
z -— Elevation 
— feDistantLight source 





Y 
15.8.3 Light source “fePointLight” 


Categories: “fePointLight” 


Light source element 


Content model: 
Any number of the follovving elements, in any order: 
“animate” 
“set” 
Attributes: 
core attributes 
zə 
“” 
z 
DOM Tnterfaces: 
SVGFEPointLightElement 


Attribute definitions: 


x — "-numbers" 
X location for the light source in the coordinate system established by attribute "primitiveUnits” on the “filter” 
element. 
If the attribute is not specifted, then the effect is as if a value of 0 vvere specifted. 
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Animatable: yes. 


y - "-numbers" 
Y location for the light source in the coordinate system established by attribute "primitiveUnits” on the “filter” 
element. 
If the attribute is not specifted, then the effect is as if a value of 0 vvere specifted. 
Animatable: yes. 





z - "-number”" 
Z location for the light source in the coordinate system established by attribute “primitiveUnits” on the “filter” 
element, assuming that, in the initial coordinate system, the positive Z-axis comes out tovvards the person 
vievving the content and assuming that one unit along the Z-axis equals one unit in X andY. 
If the attribute is not specifted, then the effect is as if a value of 0 vvere specifted. 
Animatable: yes. 


15.8.4 Light source “feSpotLight” 


Categories: “TeSpotLight” 
Light source element 


Content model: 
Any number of the follovving elements, in any order: 
“animate” 


“set” 


Attributes: 
core attributes 


eləsi 


“pointsAtX” 
“pointsAtY” 
“pointsAtZ” 
“specularExponent” 


“IimitingConeAngle” 
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DOM Tnterfaces: 
SVGFESpotLightElement 


Attribute definitions: 


x — "-numbers" 
X location for the light source in the coordinate system established by attribute "primitiveUniis” on the “filter” 
element. 
If the attribute is not specifted, then the effect is as if a value of 0 vvere specifted. 
Animatable: yes. 


y - "-numbers" 
Y location for the light source in the coordinate system established by attribute "primitiveUnits” on the “filter” 
element. 
If the attribute is not specifted, then the effect is as if a value of 0 vvere specifted. 
Animatable: yes. 


z - "-number”" 
Z location for the light source in the coordinate system established by attribute “primitiveUnits” on the “filter” 
element, assuming that, in the initial coordinate system, the positive Z-axis comes out tovvards the person 
vievving the content and assuming that one unit along the Z-axis equals one unit in XandY. 
If the attribute is not specifted, then the effect is as if a value of 0 vvere specifted. 
Animatable: yes. 


pointsAtX c "-numbers" 
X location in the coordinate system established by attribute "primitiveUnits” on the “filter” element of the 
point at vvhich the light source is pointing. 
If the attribute is not specifted, then the effect is as if a value of 0 vvere specifted. 
Animatable: yes. 


pointsAtY - "-numbers" 
Y location in the coordinate system established by attribute “rimitiveUnits” on the “filter” element of the 
point at vvhich the light source is pointing. 
If the attribute is not specifted, then the effect is as if a value of 0 vvere specifted. 
Animatable: yes. 


pointsAtZ - "-numbers" 
Z location in the coordinate system established by attribute “primitiveUnits” on the “filter” element of the 
point at vvhich the light source is pointing, assuming that, in the initial coordinate system, the positive Z-axis 
comes out tovvards the person vievving the content and assuming that one unit along the Z-axis equals one 
unit in XandY. 


If the attribute is not specifted, then the effect is as if a value of 0 vvere specifted. 
Animatable: yes. 


specularExponent - "-numbers" 
Exponent value controlling the focus for the light source. 
If the attribute is not specifted, then the effect is as if a value of 1 vvere specifled. 
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Animatable: yes. 


limitingConeAngle - "-numbers" 
A limiting cone vvhich restricts the region vvhere the light is proyected. No light is proyected outside the cone. 
“İimitingConeAngle” represents the angle in degrees betvveen the spot light axis (i.e. the axis betvveen the light 
source and the point to vvhich it is pointing at) and the spot light cone. User agents should apply a smoothing 
technique such as anti-aliasing at the boundary of the cone. 
If no value is specifted, then no limiting cone vvill be applied. 
Animatable: yes. 





15.8.5 The “lighting-color” property 


"The “lighting-color” property defines the color of the light source for filter primitives “TeDiffuseLighting” and “feSpec- 
ularLighting”. 


currentColor İ 


Value: ccolorə İcicccolor”1 1 
inherit 
lnitial: vvhite 
Applies to: “feDiffuseLighting” and “feSpecularLighting” elements 
Inherited: no 
Percentages: N/A 
Media: visual 


Animatable: yes 


15.9 Filter primitive “feBlend” 


"his filter composites tvvo ob/ects together using commonly used imaging softvvare blending modes. It performs a 


pixel-vvise combination of tvvo input images. 


Categories: “feBlend” 
Filter primitive element 


Content model: 
Any number of the follovving elements, in any order: 


animate 
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“set” 


Attributes: 
core attributes 
presentation attributes 
filter primitive attributes 
“class” 


“style” 





“in2” 
“mode” 


DOM Tnterfaces: 
SVGFEBİendElement 


Attribute definitions: 


mode — "normal / multiply / screen l darken / lighten" 
One of the image blending modes (see table belovv). If attribute “mode” is not specifted, then the effect is as if 
a value of normal vvere specifted. 
Animatable: yes. 


in2 - "(see “in” attribute)" 
"The second input image to the blending operation. This attribute can take on the same values as the “in” at- 
tribute. 
Animatable: yes. 


For all feBlend modes, the result opacity is computed as follovvs: 


qr ce 1 - (1-qa)”(1-qb) 


For the compositing formulas belovv, the follovring definitions apply: 


cr z Result color (RGB) - premultiplied 

qa cz Üpacity value at a given pixel for image A 

qb cz Opacity value at a given pixel for image B 

ca c Color (RGB) at a given pixel for image A - premultiplied 
cb c- Color (RGB) at a given pixel for image B - premultiplied 


"The follovving table provides the list of available image blending modes: 


İhormal Er ze (1-qa)”cb-ca 
İarken Er z Min ((1 - qa) ” cb - ca, (1 - qb) ” ca - cb) 


"normal" blend mode is equivalent to operator-"over" on the “feComposite” filter primitive, matches the blending 
method used by “TeMerge” and matches the simple alpha compositing technique used in SVG for all compositing 
outside of filter effects. 

Example feBlend shovvs examples of the five blend modes. 
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c?xml versionz"1.0"25 
€ DOCTYPE svg PUBLİC "-//V3C//DTD SVG 1.1//EN" 
"http: / /vvuv .v3.org/Graphics/SVG/1.1/DTD/svg11.dtd"x 
x€svg vidth-"5cm" height-"5cm" vievBoxz"0 0 500 500" 
xmlnsz"http: / /vv/ .vV3.0T9/2000/svg" versionz"1.1"5 
etitlesExample feBlend - Examples of feBlend modesc/titlez 
ecdescsFive text strings blended into a gradient, 
vith one text string for each of the five feBlend modes.-/desc” 
edefsəs 
elinearGradient id-"MyGradient" gradientUnits-"userSpacetnUse" 
xlz"100" y1-"0" x2-"300" y2-"0"5 
€stop offsetz"0" stop-colorz"000000" /5 
€stop offsete".33" stop-color-"ETTTTTT" /s 
€stop offsete".67" stop-color-e"Z110000" /5 
c€stop offsetz"1" stop-colorz"/808080" /5 
e/linearGradient- 
efilter id-"Normal"- 
efeBlend modez"normal" in2-"BackgroundImage" in-"SourceGraphic"/x 
e/filter- 
efilter ide"Multipiy"- 
cfeBlend modez"multiply" in2-"Backgroundlmage" in-"SourceGraphic"/x 
e/filter- 
efilter id-"Screen"s 
efeBlend modez"screen" in2-"BackgroundImage" in-"SourceGraphic"/s 
e/filter- 
efilter id-"Darken"z 
efeBlend modez"darken" in2-"BackgroundImage" in-"SourceGraphic"/x 
e/filter- 
efilter id-"Lighten"x 
efeBlend modez-"lighten" in2-"Backgroundlmage" in-"SourceGraphic"/s 
e/filter- 
c/defso 
erect fill-"none" strokez"blue" 
xz"1" yz"1" vidth-"498" height-"498"/5 
s€g enable-background-"nev" s 
crect xe"100" y-"20" vidth-"300" height-"460" fill-"url(£MyGradient)" /5 
vg font-family-"Verdana" font-sizez"75" fill-")888888" fill-opacitye".6" 5 
€text xe"50" ye-"90" filter-"ur1(£Normal1)" xNormal-/texte 
etext xe"50" ye"180" filter-"url(£Multiply)" sMultiply-/text- 
etext xz"50" ye"270" filter-"url(£Screen)" sScreen-/text- 
etext xz"50" yz"360" filter-"url(£Darken)" sDarken-/text- 
etext xz"50" yz-"450" filter-"url(£Lighten)" sLighten-/text- 
x/g” 
x/g” 
xs/ svg” 
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Example feBlend 





15.10 Filter primitive “feColorMatrix” 


"This filter applies a matrix transformation: 


İ İ a00 a01 a02 a03 a04 1 İ 
İ İ a10 a11 a12 a13 al4 1 İ 
İ ez 1 a20 a21 a22 a23 a24 1 ” 
İ İ a30 a31 a32 a33 a34 1 İ 
İ I10:h00 0 0 11İ İ 


mu 


on the RGBA color and alpha values of every pixel on the input graphics to produce a result vvith a nevv set of 
RGBA color and alpha values. 
The calculations are performed on non-premultiplied color values. If the input graphics consists of premulti- 
plied color values, those values are automatically converted into non-premultiplied color values for this operation. 
These matrices often perform an identity mapping in the alpha channel. If that is the case, an implementation 
can avoid the costly undoing and redoing of the premultiplication for all pixels vvith A - 1. 


Categories: “feColorMatrix” 
Filter primitive element 


Content model: 
Any number of the follovving elements, in any order: 
“animate” 


“set” 


Attributes: 
core attributes 
presentation attributes 
filter primitive attributes 
“class” 


“style” 


in 
“type” 
“values” 


DOM Tnterfaces: 
SVGFEColorMatrixElement 
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Attribute definitions: 


type — "matrix / saturate / hueRotate / luminanceToAlpha" 
Imndicates the type of matrix operation. The keyvvord "matrix" indicates that a full 5x4 matrix of values vvill be 
provided. "The other keyvvords represent convenience shortcuts to allovv commonly used color operations to 





be performed vvithout specifying a complete matrix. If attribute “type” is not specifted, then the effect is as if 
a value of matrix vvere specifted. 
Animatable: yes. 


values — "list of -number-s" 
The contents of “values” depends on the value of attribute “type”: 


e For type-"matrix", “values” is a list of 20 matrix values (a00 a01 a02 a03 a04 a10 a11 ... a34), separated by 
vvhitespace and/or a comma. For example, the identity matrix could be expressed as: 


typeze"matrix" 
valuese"10000 01000 00100 00010" 


e Tor type-"saturate", “values” is a single real number value (0 to 1). A saturate operation is equivalent to 
the follovving matrix operation: 


IR" İ 10.21340.787s 0.715-0.715s 0.072-0.072s 0 01 İRİ 
Iı "1 10.213-0.213s 0.71540.285s 0.072-0.072s5 0 01 İGİ 
I B" 1 - 10.213-0.213s 0.715-0.715s 0.07240.928s0 0“ İBİ 
LA" 1 0 0 0 101 İ1Aİ 
ıı 1 0 0 0011 111 


e For type-"hueRotate", “values” is a single one real number value (degrees). A hueRotate operation is equi- 
valent to the follovving matrix operation: 


İ R" İ İ a00 a01 a62 0 01 İRİ 
Iİ G" 1 İ a10 al1 al12 0 01 IbGİ 
İB" İ z İl a20 a21 a22 0 0İ”İBİ 
İ A" 1 İ 0 0 0 101 İAİ1 
İ1 1 Iİ 0 0 0 0 11 I11 


vvhere the terms a00, a01, etc. are calculated as follovvs: 


İ a00 a01 a62 1 1F0.213 40.715 40.0721 
İ a10 a11 a12 / - 140.213 40.715 40.0721 4 
İ a20 a21 a22 1 1:0.213 40.715 40.0721 


.787 -0.715 -0.0721 
.213 40.285 -0.0721 4 
.213 -0.715 40.9281 
.213 -0.715-40.9281 
.143 40.140-0.2831 
.787 40.71540.0721 


cos (hueRotate value) ” 


sin(hueRotate value) ” 
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Thus, the upper left term of the hue matrix turns out to be: 
.213 4 cos(hueRotate value)”.787 - sin(hueRotate value)”.213 


e For type-"luminanceToAlpha", “values” is not applicable. A luminanceToAlpha operation is equivalent to 
the follovving matrix operation: 





0.212 0.715 0.072 


(co llollic kc co) 
so 098oceoco 
coli ic kc kc) 
es eceoco 
ooo 


İRİ 
İG" 1 
İB" zl 
İLA" 
bı 1 


mu 


If the attribute is not specified, then the default behavior depends on the value of attribute “type”. If 
type-"matrix", then this attribute defaults to the identity matrix. If type-"saturate", then this attribute defaults 
to the value 1, vvhich results in the identity matrix. If type-"hueRotate", then this attribute defaults to the 
value 0, vvhich results in the identity matrix. 

Animatable: yes. 


Example feColorMatrix shovvs examples of the four types of feColorMatrix operations. 


c?xml versionz"1.0"25 
x İDOCTYPE svg PUBLİC "-//V/3C//DTD SVG 1.1//EN" 
"http://vvv .v3.org/Graphics/SVG/1.1/DTD/svg11.dtd"s 
c€svg vidth-"8cm" height-"5cm" vievBoxz"0 0 800 500" 
xmlnse"http: / /vvv .vV3.0r9/2000/svg" versione"1.1"5 
etitlesExample feColorMatrix - Examples of feColorMatrix operationsc/titlex 
edescsFive text strings shoving the effects of feColorMatrix: 
an unfiltered text string acting as a reference, 
use of the feColorMatrix matrix option to convert to grayscale, 
use of the feColorMatrix saturate option, 
use of the feColorMatrix hueRotate option, 
and use of the feColorMatrix luminanceToAlpha option.-/desc” 
edefss 
elinearGradient ide-"MyGradient" gradientUnits-"userSpace0nUse" 
x1-"100" y1-"0" x2-"500" y2-"0"5 
€stop offsetz"0" stop-colorz"ZTfT001f" /s 
€stop offsete".33" stop-colorz"Z881188" /5 
€stop offsete".67" stop-colorz"22020ff" /s 
€stop offsetz"1" stop-colorz"id00000" /5 
e/linearGradient- 
efilter ide"Matrix" filterUnits-"obiectBoundingBox" 
xz"0sş" ye"Os" vidth-"10085" height-"1008"5 
efeColorMatrix typee"matrix" in-"SourceGraphic" 
valuesz".33 .33 .3300 
.33 .33 .3300 
.33 .33 .3300 
.33 .33 .33 0 0"/5 
e/filter- 
efilter ide-"Saturate40" filterUnits-"obiectBoundingBox" 
xze"0sş" ye"Os" vidth-"10085" height-"1008"5 
efeColorMatrix typeze"saturate" inz"SourceGraphic" valuesz"0.4"/5 
e/filter- 
efilter id-"HueRotate90" filterUnits-"obfiectBoundingBox" 
xze"0sş" ye"Os" vidth-"10085" height-"1008"5 
efeColorMatrix typeze"hueRotate" in-"SourceGraphic" valuesz"90"/5 


e/filters 
efilter id-"LuminanceToAlpha" filterUnits-"obiectBoundingBox" 
xz"0s" ye"Os" vidth-"10085" height-"1008"5 
efeColorMatrix typeze"luminanceToAlpha" in-"SourceGraphic" resulte"a"/s 
cfeComposite in-"SourceGraphic" in2-"a" operatorz"in" /” 


e/filters 
s/defss 
erect fill-"none" strokez"blue" 
xz"1" ye"1" vidth-"798" height-"498"/5 
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s€g font-family-"Verdana" font-sizez"75" 
font-veight-"bold" fill-"ur1(£MyGradient)" xs 
crect xe"100" y-"0" vidth-"500" height-"20" /5 





€text ye"9ö"sUnfiltered-/text- 
€text ye"190" filter-"url(/fMatrix)" sMatrixc/text” 
e€text ye"290" filter-"url(/Saturate40)" sSaturatec/text- 
e€text yz"390" filter-"ur1(4HueRotate90)" sHueRotatec/text- 
€text yz"490" filter-"ur1(£LuminanceToAlpha)" xLuminance-/text” 
x/g” 
s/ svg” 
Example feColorMatrix 
kı 7 








Unfiltered 


Sa” urate 
Huo-Rotate 





15.11 Filter primitive “feComponentTransfer” 


This filter primitive performs component-vvise remapping of data as follovvs: 


R" - feFuncR( R ) 
G" £ feFuncG( 6 ) 
B" - feFuncB( B ) 
A" - feFuncA( A ) 


for every pixel. It allovvs operations like brightness adiustment, contrast adiustment, color balance or thresholding. 

The caleulations are performed on non-premulltiplied color values. If the input graphics consists of premullti- 
plied color values, those values are automatically converted into non-premultiplied color values for this operation. 
(Note that the undoing and redoing of the premultiplication can be avoided if feFuncA is the identity transform 
and all alpha values on the source graphic are set to 1.) 


Categories: “feComponentTransfer” 
Filter primitive element 
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Content model: 
Any number of the follovving elements, in any order: 
“feFuncA” 
“feFuncB” 
“feFuncG” 
“feFuncR” 


Attributes: 
core attributes 
presentation attributes 
filter primitive attributes 
“class” 
“style” 


ın 


DOM Tnterfaces: 
SVGFEComponentTransferElement 


"The child elements of a “feComponentTransfer” element specify the transfer funetions for the four channels: 


e “feFuncR” — transfer function for the red component of the input graphic 

e “feFuncG” — transfer function for the green component of the input graphic 
e “feFuncB” — transfer function for the blue component of the input graphic 

e “feFuncA” — transfer function for the alpha component of the input graphic 


The follovving rules apply to the processing of the “feComponentTransfer” element: 


e If more than one transfer function element of the same kind is specifted, the last occurrence is to be used. 
e If any of the transfer function elements are unspecifted, the “feComponentTransfer” must be processed as if 
those transfer function elements vvere specifted vvith their “type” attributes set to "identity". 


Categories: “feFuncR” 
None 


Content model: 
Any number of the follovving elements, in any order: 
“animate” 


“set” 


Attributes: 
core attributes 
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transfer function element attributes 


DOM Interfaces: 
SVGFEFuncRElement 


Categories: “feFuncG” 
None 


Content model: 
Any number of the follovving elements, in any order: 
“animate” 
“set” 
Attributes: 


core attributes 
transfer function element attributes 


DOM Interfaces: 
SVGFEFuneGElement 


Categories: “feFuncB” 
None 


Content model: 
Any number of the follovving elements, in any order: 
“animate” 
“set” 
Attributes: 


core attributes 
transfer function element attributes 


DOM Tnterfaces: 
SVGFEFuncBElement 


Categories: “feFuncA” 
None 


Content model: 
Any number of the follovving elements, in any order: 


“animate” 


“set” 


Attributes: 
core attributes 
transfer function element attributes 
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DOM Tnterfaces: 
SVGFEFuncAElement 


"The attributes belovv are the transfer function element attributes, vvhich appliy to sub-elements “feFuncR”, “feFun- 
eG”, “feFuncB” and “feFuncA” that define the transfer functions. 





Attribute definitions: 


type — "identity / table / discrete / linear l gamma" 
Imndicates the type of component transfer function. The type of function determines the applicability of the 
other attributes. 
In the follovving, C is the initial component (e.g., feFuncR”), C" is the remapped component: both in the 
closed interval 10.11. 


e For identity: 
cc 


e For table, the function is defined by linear interpolation betvveen values given in the attribute “tableVal- 
ues”. The table has n-1 values (i.e., vo to vn) specifying the start and end values for n evenly sized inter- 
polation regions. Interpolations use the follovring formula: 


For a value C c 1 find k such that: 
k/n cz € c (k-41)/n 


"he result C" is given by: 


C" z vk “ (C - k/n)”n ” (Vks1 - Vk) 
If C - 1then: 
o Vn. 


e Tor discrete, the function is defined by the step function given in the attribute “tableValues”, vvhich 
provides a İst of n values (i.e., vo to vn-1) in order to identify a step function consisting of nı steps. The 
step function is defined by the follovving formula: 


For a value C c 1 find k such that: 
k/n cz € c (k-r1)/n 


"The result C" is given by: 
C" z Vk 


If C - 1then: 
cı Vn-I. 
ə For linear, the function is defined by the follovving linear equation: 
C" z slope ” C H intercept 
ə TYor gamma, the function is defined by the follovving exponential function: 
C" z amplitude ” pov(C, exponent) 4 offset 
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Animatable: yes. 


tableValues - "(list of -number”s)" 
VVhen type-"table", the list of -numberss v0, v1,...vn, separated by vvhite space and/or a comma, vvhich define 
the lookup table. An empty list results in an identity transfer function. If the attribute is not specifted, then 
the effect is as if an empty list vvere provided. 
Animatable: yes. 





slope - "-numbers" 
VVhen type-"linear", the slope of the linear function. 
If the attribute is not specifted, then the effect is as if a value of 1 vvere specifted. 
Animatable: yes. 


intercept - "-numbers" 
VVhen type-"linear", the intercept of the linear function. 
If the attribute is not specifted, then the effect is as if a value of 0 vvere specifted. 
Animatable: yes. 


amplitude - "-numbers" 
VVhen type-"gamma", the amplitude of the gamma function. 
If the attribute is not specifted, then the effect is as if a value of 1 vvere specifted. 
Animatable: yes. 


exponent z "-numbers" 
VVhen type-"gamma", the exponent of the gamma function. 
If the attribute is not specifted, then the effect is as if a value of 1 vvere specifled. 
Animatable: yes. 


offset - "-numbers" 
VVhen type-"gamma", the offset of the gamma function. 
If the attribute is not specifted, then the effect is as if a value of 0 vvere specifted. 
Animatable: yes. 


Example feComponentTransfer shovvs examples of the four types of feComponentTransfer operations. 


c?xml versionz"1.0"?25 
xc DOCTYPE svg PUBLİC "-//V3C/ //DTD SVG 1.1//EN" 
"http: / /uvvv .v3.org/Graphics/SVG/1.1/DTD/svg11.dtd"- 
s€svg vidth-"8cm" height-"4cm" vievBoxz"0 0 800 400" 
xmlnsz"http: / /vv/ .vV3.0T9/2000/svg" versionz"1.1"5 


etitlesExample feComponentTransfer - Examples of feComponentTransfer operations-c/titles 
edescsoFour text strings shoving the effects of feComponentTransfer: 
an identity function acting as a reference, 
use of the feComponentTransfer table option, 
use of the feComponentTransfer linear option, 
and use of the feComponentTransfer gamma option.-c/descx 
edefso 
elinearGradient id-"MyGradient" gradientUnits-"userSpacetnÜUse" 
x1-"100" y1-"0" x2-"600" y2-"0"5 
€stop offsetz"0" stop-colorz"/Tf0000" /5 
e€stop offsetz".33" stop-colorz"001100" /5 
€stop offsetz".67" stop-colorz"00001f" /s 
e€stop offsetz"1" stop-colorz"000000" /5 
e/linearGradient- 
efilter id-"Identity" filterUnits-"obiectBoundingBox" 
xze"0sş" ye"Os" vidth-"1005" heighte"1008"5 
efeComponentTransferx 
cfeFuncR typez"identity"/s 
cfeFuncG typez"identity"/s 
cfeFuncB typez"identity"/s 
cfeFuncA typez"identity"/s 
c/ feComponentTransferx” 
e/filter- 
efilter id-"Table" filterUnits-"obiectBoundingBox" 
xze"0sş" ye"Os" vidth-"1005" heighte-"1008"5 
eTfeComponentTransferx” 
efeFuncR typez"table" tableValuesz"0 0 1 1"/5 
efeFunc6G typez"table" tableValuesz"1 1 0 0"/5 
efeFuncB typez"table" tableValuesz"0 1 1 0"/5 
c/ feComponentTransferx” 
e/filter- 
efilter id-"Linear" filterUnits-"obfiectBoundingBox" 
xze"0sş" ye"Os" vidth-"1005" heighte"1008"5 
eTfeComponentTransferx 
cfeFuncR typez"linear" slopez".5" intercepte".25"/5 
cfeFuncG typez"linear" slopez".5" intercepte"0"/5 
cfeFuncB typez"linear" slopez".5" intercepte".5"/5 
c/ feComponentTransferx” 
e/filter- 
efilter id-"Gamma" filterUnits-"obiectBoundingBox" 
xze"0sş" ye"Os" vidth-"1005" heighte-"1008"5 
eTeComponentTransferx” 
efeFuncR typez"gamma" amplitudez"2" exponentze"5" offsetz"0"/5 
efeFunc6G typez"gamma" amplitudez"2" exponent-"3" offsetz"0"/5 
efeFuncB typez"gamma" amplitudez"2" exponente"1" offsetz"0"/5 
c/ feComponentTransferx” 
e/filter- 
s/defss 
erect fill-"none" strokez"blue" 
xz"1" ye"1" vidth-"798" height-"398"/5 
s€g font-family-"Verdana" font-sizez"75" 
font-veight-"bold" fill-"ur1(£MyGradient)" x 
crect xe"100" y-"0" vidth-"600" height-"20" /5 
etext xe"100" y-"90"s1dentityc/text- 
ctext xe"100" ye"190" filter-"ur1(/Table)" sTableLookup-/ text” 
etext xe"100" ye"290" filter-"url(/Linear)" sLinearFunc-c/textə” 
etext xe"100" ye"390" filter-"ur1(36amma) " xGammaFuncc/ text” 
x/g” 
xs/ svg” 


c 
.Ə 
5 
İv) 
m") 
(s 
(3) 
- 
E 
ə) 
(ə) 
o 
ad 
. 
s 








c 
.o 
5 
İv) 
m") 
(s 
(3) 
E 
E 
ə) 
(ə) 
o 
ad 
. 
s 





Example feComponentTransfer 


Identity 
TableLookup 
LinearFunc 
GammaFunc 





15.12 Filter primitive “feComposite” 


"his filter performs the combination of the tvvo input images pixel-vvise in image space using one of the Porter- 
Duff fPORTERDUFFİ) compositing operations: over, in, atop, out, xor (İSVG-COMPOSTTINGİ. Additionally, a 
component-vvise arifhmetic operation (vvith the result clamped betvveen 10..11) can be applied. 

The arifhmetic operation is useful for combining the output from the “feDiffuseLighting” and “feSpecularLight- 
ing” filters vvith texture data. İt is also useful for implementing dissolve. If the arifhmetic operation is chosen, each 
result pixel is computed using the follovving formula: 


result z k18“i1i2 4 k2F”il 4 k3”i2 4 k4 


vvhere: 


e il and 12 indicate the corresponding pixel channel values of the input image, vvhich map to in and in2 re- 
spectively 
e kl, k2, K3 and k4 indicate the values of the attributes vvith the same name 


For this filter primitive, the extent of the resulting image might grovv as described in the section that describes the 
filter primitive subregion. 


Categories: “feComposite” 
Filter primitive element 


Content model: 
Any number of the follovving elements, in any order: 
“animate” 
“set” 
Attributes: 
core attributes 
presentation attributes 
filter primitive attributes 


“class” 


“style” 
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DOM Interfaces: 
SVGFECompositeElement 





Attribute definitions: 


operator - "over İl in /l out / atop / xor / arithmetic" 
"The compositing operation that is to be performed. Aİl of the “operator” types except arithmetic match the 
corresponding operation as described in İPORTERDUFFİ. The arithmetic operator is described above. If at- 
tribute “operator” is not specifted, then the effect is as if a value of over vvere specifted. 
Animatable: yes. 


k1 - "-numbers" 
Only applicable if operator-"arithmetic". 
If the attribute is not specifted, the effect is as if a value of 0 vvere specifted. 
Animatable: yes. 


k2 - "-numbers" 
Only applicable if operator-"arithmetic". 
If the attribute is not specifted, the effect is as if a value of 0 vvere specifted. 
Animatable: yes. 


k3 - "-numbers" 
Only applicable if operator-"arithmetic". 
If the attribute is not specifted, the effect is as if a value of 0 vvere specifted. 
Animatable: yes. 


k4 — "-numbers" 
Only applicable if operator-"arithmetic". 
If the attribute is not specifted, the effect is as if a value of 0 vvere specifted. 
Animatable: yes. 
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in2 - "(see “in” attribute)" 
"The second input image to the compositing operation. This attribute can take on the same values as the “in” 
attribute. 
Animatable: yes. 


Example feComposite shovvs examples of the six types of feComposite operations. It also shovvs tvvo different tech- 
niques to using the Backgroundlmage as part of the compositing operation. 

The first tvvo rovvs render bluish triangles into the background. A filter is applied vvhich composites reddish 
triangles into the bluish triangles using one of the compositing operations. The result from compositing is dravvn 
onto an opaque vvhite temporary surface, and then that result is vvritten to the canvas. (1he opaque vvhite tempor- 
ary surface obliterates the original bluish triangle.) 

The last tvvo rovvs apply the same compositing operations of reddish triangles into bluish triangles. Hovvever, 
the compositing result is directly blended into the canvas (the opaque vvhite temporary surface technique is not 
used). İn some cases, the results are different than vvhen a temporary opaque vvhite surface is used. The origin- 
al bluish triangle from the background shines through vvherever the compositing operation results in completely 
transparent pixel. In other cases, the result from compositing is blended into the bluish triangle, resulting in a dif- 
ferent final color value. 


c?xml versionz"1.0"25 
x DOCTYPE svg PUBLİC "-///3C//DTD SVG 1.1//EN" 
"http://vvv .v3. org/Graphics/SVG/1.1/DTD/svg11.dtd"s 
€Svg vidth-"330" height-"195" vieuvBoxz"0 0 1100 650" versione"1.1" 
xmlnsz"http: / /vuv/ .v(3.0T9/2000/svg" xmlns:xlinke"http:/ /vuv.v3.org/1999/xlink"s 
etitlesExample feComposite - Examples of feComposite operations-c/titlex 
edescsFour rovSs Of six pairs of overlapping triangles depicting 
the six different feComposite operators under different 
opacity values and different clearing of the background.-/desc” 
edefsəs 
edescsDefine tuvo sets of six filters for each of the six compositing operators. 
The first set vipes out the background image by flooding vith opaque vhite. 
The second set does not vipe out the background, vith the result 
ha he background sometimes shines through and is other cases 
is blended into itself (i.e., "double-counting") .-/desc” 
efilter id-"overFlood" filterUnits-"obiectBoundingBox" xz"-58" yz"-58" vidth-"11086" height-"1108"5 
efeFlood f1ood-colorz"ETTffff" flood-opacitye"1" resulte"f1ood"/s 
cfeComposite in-"SourceGraphic" in2-"BackgroundImage" operatorz"over" resulte"comp"/5 
efeMerges -TeMergeNode in-"f1ood"/s -feMergeNode in-"comp"/s -/feMerge- 
e/filters 
efilter id-"inFlood" filterUnits-"obiectBoundingBox" xz"-58" y-"-58" vidth-"11086" height-"1108"- 
efeFlood f1ood-colorz"ETTTTff" flood-opacitye"1" resulte"f1ood"/s 
cfeComposite in-"SourceGraphic" in2-"Backgroundlmage" operator-"in" result-"comp"/5 
efeMerges -TeMergeNode inz"f1ood"/s -feMergeNode in-"comp"/s -/feMerge- 
e/filter- 
efilter id-"outFlood" filterUnits-"obiectBoundingBox" xze"-58" yz"-58" vidth-"1108" height-"1108"5 
efeFlood f1ood-colorz"ETTffTff" flood-opacitye"1" resulte"f1lood"/s 
cfeComposite in-"SourceGraphic" in2-"BackgroundImage" operator-"out" resulte"comp"/z 
efeMerges -TeMergeNode in-z"f1ood"/s -feMergeNode in-"comp"/x -/feMerge- 
e/filter- 
efilter id-"atopFlood" filterUnits-"obiectBoundingBox" xz"-5s" y-z"-58" vidth-"11086" height-"1108"5 
efeFlood f1ood-colorz"ETTffff" flood-opacitye"1" resulte"f1ood"/s 
cfeComposite in-"SourceGraphic" in2-"BackgroundImage" operator-"atop" resulte"comp"/5 
eTeMerges -TeMergeNode in-"f1ood"/s -feMergeNode in-"comp"/s -/feMerge- 
e/filter- 
efilter id-"xorFlood" filterUnits-"obiectBoundingBox" xze"-58" yz"-58" vidth-"1108" height-"1108"5 
efeFlood f1ood-colorz"ETTffff" flood-opacitye"1" resulte"f1ood"/s 
cfeComposite in-"SourceGraphic" in2-"BackgroundImage" operator-"xor" resulte"comp"/z 
efeMerges -TeMergeNode in-"f1ood"/s -feMergeNode in-"comp"/s -/feMerge- 
e/filter- 
efilter ide-"arithmeticFlood" filterUnits-"obiectBoundingBox" 
xz"-59" ye"-58" vidth-"1108" height-"1108"5 
efeFlood f1ood-colorz"ETTTfff" flood-opacitye"1" resulte"f1ood"/s 
efeComposite in-"SourceGraphic" in2-"BackgroundImage" resulte"comp" 
operatore"arithmetic" klze".5" k2ze".5" k3z",5" k4z".5"/5 



































eTeMerges -feMergeNode inz"f1ood"/x -feMergeNode in-"comp"/z -/feMergex 
e/filter- 
efilter id-"overNoFlood" filterUnits-"obfectBoundingBox" xz"-58" y-"-56" vidth-"1108" height-"1108"5 
cfeComposite in-"SourceGraphic" in2-"BackgroundImage" operatorz"over" resulte"comp"/5 
e/filter- 
efilter id-"inNoFlood" filterUnits-"obfiectBoundingBox" xz"-58" y-"-58" vidth-"11086" height-"1108"5 
cfeComposite in-"SourceGraphic" in2-"Backgroundlmage" operator-"in" result-"comp"/5 
e/filter- 
efilter id-"outNoFlood" filterUnits-"obiectBoundingBox" xz"-58" yz"-58" vidth-"1108" height-"1105"5 
cfeComposite in-"SourceGraphic" in2-"BackgroundImage" operator-"out" resulte"comp"/z 
e/filter- 
efilter id-"atopNoFlood" filterUnits-"obfectBoundingBox" xz"-58" y-"-56" vidth-"1108" height-"1108"5 
cfeComposite in-"SourceGraphic" in2-"BackgroundImage" operator-e"atop" resulte"comp"/5 
e/filter- 
efilter id-"xorNoFlood" filterUnits-"obiectBoundingBox" xz"-58" yz"-58" vidth-"1108" height-"1105"5 
cfeComposite in-"SourceGraphic" in2-"BackgroundImage" operator-"xor" resulte"comp"/z 
e/filter- 
efilter ide-"arithmeticNoFlood" filterUnits-"obiectBoundingBox" 
xz"-59" ye"-58" vidth-"1108" height-"1108"5 
cfeComposite in-"SourceGraphic" in2-"Backgroundlmage" resulte"comp" 
operatore"arithmetic" klze".5" k2ze".5" k3z",5" k4z".5"/5 
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e/filter- 
cpath id-"Blue100" dz"M 0 0 L 100 0 L 100 100 z" fill-"200ffff" /- 
cpath id-"Red100" d-"M 0 0 L 0 100 L 100 0 z" fill-"ETf00ff" /s5 
cpath id-"Blue50" d-"M 0 125 L 100 125 L 100 225 z" fill-"200ffff" fill-opacitye".5" /s 
cpath id-"Red50" de"M 0 125 L 0 225 L 100 125 z" fill-"/Tf001f" fill-opacitye".5" /s 
€g id-"TuoBlueTriangles"x 
cuse xlink:href-"ZBlue100"/5 
cuse xlink:href-"ZBlue50"/5 
x/g” 
€g ide"BlueTriangles"x 
suse transform-"translate(275,25)" xlink:href-"ZTuoBlueTriangles"/x 
suse transform-"translate(400,25)" xlink:href-"ZTuoBlueTriangles"/x 
suse transform-"translate(525,25)" xlink:href-"ZTuoBlueTriangles"/x 
suse transform-"translate(650,25)" xlink:href-"ZTuoBlueTriangles"/x 
cuse transform-"translate(775,25)" xlink:href-"ZTuoBlueTriangles"/x 
cuse transform-"translate(900,25)" xlink:href-"ZTuoBlueTriangles"/x 
x/g” 
c/defs- 











cerect fill-"none" strokeze"blue" xze"1" ye"1" vidth-"1098" height-"648"/5 
vg font-family-"Verdana" font-size-"40" shape-rendering-"crispEdges"x 
edescoRender the examples using the filters that drav on top of 
an opaque vhite surface, thus obliterating the background.-/desc” 
€g enable-background-"nev"z 
etext xe"15" ye"75"sopacity 1.0-/text- 
€text xe"15" ye"115" font-sizeze"27"-(vith feFlood)-/textə” 
etext xe"15" y-"200"co0pacity 0.5-/texte 
etext xe"15" ye"240" font-sizeze"27"-(uvith feFlood)-/textə 
cuse xlink:href-"öBlueTriangles"/5 
€g transforme"translate(275,25)"- 
cuse xlink:href-"ZRed100" filter-"ur1(0verFlood)" /s 
cuse xlink:href-"ZRed50" filter-"ur1(£overFlood)" /5 
etext xze"5" yz"275"soverc/texte 
x/g” 
€g transforme"translate (400 25)" 
cuse xlink:href-"ZRed100" filter-"url(öFinFlood)" /s 
cuse xlink:href-"ZRed50" filter-"url(£FinFlood)" /5 
etext xze"35" yz"275"sinc/text- 
c/g” 
€g transforme"translate(525,25)"- 
cuse xlink:href-"ZRed100" filter-"ur1(öoutFlood)" /5 
cuse xlink:href-"ZRed50" filter-"ur1(£outFlood)" /s 
etext xe"15" yz"275"soutc/textə” 
c/g” 
€g transforme"translate(650,25)"- 
cuse xlink:href-"ZRed100" filter-"ur1(satopFlood)" /s 
cuse xlink:href-"ZRed50" filter-"ur1(£atopFlood)" /s 
etext xe"10" yz"275"satopc/text- 
c/g” 
€g transforme"translate(775,25)"- 
cuse xlink:href-"ZRed100" filter-"ur1(öxorFlood)" /s 
cuse xlink:href-"ZRed50" filter-"ur1(£xorFlood)" /s 
etext xe"15" yz"275"sxorc/text” 
c/g” 
sg transform-"translate (900,25)"- 
cuse xlink:href-"ZRed100" filter-"url(FarithmeticFlood)" /” 
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cuse xlink:hrefe"ZRed50" filter-"url(FarithmeticFlood)" /” 
e€text xze"-25" y-"275"sarithmetic-/text” 
x/g” 
x/g” 
€g transform-"translate(0,325)" enable-backgrounde"nev"s 
edescoRender the examples using the filters that do not obliterate 
the background, thus sometimes causing the background to continue 
to appear in some cases, and in other cases the background 
image blends into itself ("double-counting") .-/descə 
etext xz"15" yz"75"sopacity 1.0-/text- 
etext xe"15" ye"115" font-sizeze"27"-(vithout feFlood)-c/textə- 
e€text xe"15" yz"200"sc0pacity 0.5-/text- 
etext xe"15" ye"240" font-sizez"27"-(vithout feFlood)-/textə” 
cuse xlink:href-"ZBlueTriangles"/5 
€g transforme"translate(275,25)"- 
cuse xlink:hrefe"2ZRed100" filterz"ur1(£overNoFlood)" /5 
suse xlink:hrefz"ZRed50" filter-"ur1(4verNoFlood)" /x 
etext xze"5" yz"275"soverc/text” 
x/g” 
€g transform-"translate(400,25)" 
cuse xlink:hrefe"ZRed100" filter-"ur1(FinNoFlood)" /5 
cuse xlink:href-"ZRed50" filter-"url(FinNoFl1ood)" /x 
etext xze"35" yze"275"sinc/text- 
x/g” 
€g transforme"translate(525,25)"- 
cuse xlink:href-"ZRed100" filterze"ur1(£outNoFlood)" /x 
cuse xlink:hrefe"ZRed50" filter-"ur1(2£outNoFlood)" /5 
etext xe"15" yz"275"soutc/text” 
x/g” 
€g transforme"translate(650,25)"- 
cuse xlink:hrefe"ZRed100" filterz"ur1(ZatopNoFlood)" /5 
cuse xlink:hrefe"ZRed50" filter-"ur1(atopNoFlood)" /x 
etext xe"10" yz"275"satopc/text- 
x/g” 
sg transforme"translate(775,25)"- 
cuse xlink:href-"ZRed100" filter-"ur1(ö”xorNoFlood)" /s 
cuse xlink:hrefe"ZRed50" filter-"ur1(2xorNoFlood)" /5 
etext xe"15" yz"275"sxorc/textx 
x/g? 
€g transforme"translate (900 25)" 
cuse xlink:href-"ZRed100" filter-"url(FarithmeticNoFlood)" /” 
cuse xlink:hrefe"ZRed50" filter-"url(FarithmeticNoFlood)" /x 
etext xze"-25" y-"275"sarithmetic-/text” 
x/g” 
x/g” 
x/g” 
s/ svg” 








Example feComposite 


opacity 1.0 yv “ b x. b 
(vith feFlood) 
opacity 0.5 


(th feFlood) 
over in out atop xor arithmetic 


opacity 1.0 v — b, x. b, 
(vrithout feFlosd3) 
xu VA “VU “PA 
(vvithout feFlood) 

n 


over i out atop xor arithmetic 


c 
.o 
5 
İv) 
m") 
(s 
(3) 
E 
E 
ə) 
(ə) 
o 
ad 
. 
s 





15.13 Filter primitive “feConvolveMatrix” 


feConvolveMatrix applies a matrix convolution filter effect. A convolution combines pixels in the input image vvith 
neighboring pixels to produce a resulting image. A vvide variety of imaging operations can be achieved through 
convolutions, including blurring, edge detection, sharpening, embossing and beveling. 

A matrix convolution is based on an n-by-m matrix (the convolution kernel) vrhich describes hovv a given 
pixel value in the input image is combined vvith its neighboring pixel values to produce a resulting pixel value. 
Each result pixel is determined by applying the kernel matrix to the corresponding source pixel and its neighbor- 


ing pixels. The basic convolution formula vvhich is applied to each color value for a given pixel is: 
COLORx,Y € ( 
SUM T-0 to TorderY-1) ( 
SUM 2-0 to TorderX-11 1 
İ SOURCE X-targetX:0, Y-targetyaı1 ” kernelMatrixorderX-1-1, oorderY-I-1 
1 
)/ divisor 4 bias ” ALPHAx,Y 


vvhere "orderX" and "orderY" represent the X and Y values for the “order” attribute, "targetX" represents the value 
of the “target” attribute, "targetY" represents the value of the “targetY” attribute, "kernelMatrix" represents the 
value of the “kernelMatrix” attribute, "divisor" represents the value of the “divisor” attribute, and "bias" represents 
the value of the “bias” attribute. 

Note in the above formulas that the values in the kernel matrix are applied such that the kernel matrix is ro- 
tated 180 degrees relative to the source and destination images in order to match convolution theory as described 
in many computer graphics textbooks. 

To illustrate, suppose you have a input image vvhich is 5 pixels by 5 pixels, vvhose color values for one of the 


color channels are as follovvs: 


0 20 40 235 235 
100 120 140 235 235 
200 220 240 235 235 
225 225 255 255 255 
225 225 255 255 255 


and you define a 3-by-3 convolution kernel as follovvs: 


——- 
CO UT N) 
KO O U) 


Letfs focus on the color value at the second rovr and second column of the image (source pixel value is 120). As- 
suming the simplest case (vvhere the input images pixel grid aligns perfectly vvith the kernel s pixel grid) and as- 
suming default values for attributes “divisor”, “targetX” and “targetY”, then resulting color value vvill be: 


(985 0: 8” 20 7” 40 - 
67100 r 5“120 r 45140 4 
38200 F 27220 Fr 17240) / (9F:8:74:64544434281) 
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Because they operate on pixels, matrix convolutions are inherently resolution-dependent. "To make “feCon- 
volveMatrix” produce resolution-independent results, an explicit value should be provided for either the “filterRes” 
attribute on the “filter” element and/or attribute “kernelUnitLength”. 

“kernelUnitLengih”, in combination vvith the other attributes, defines an implicit pixel grid in the filter effects 
coordinate system (i.e., the coordinate system established by the “primitiveUnits” attribute). If the pixel grid es- 
tablished by “kernelUnitLengih” is not scaled to match the pixel grid established by attribute “filterRes” (implicitly 
or explicitly), then the input image vvill be temporarily rescaled to match its pixels vvith “kernelUnitLengih”. The 
convolution happens on the resampled image. After applying the convolution, the image is resampled back to the 
original resolution. 

VVhen the image must be resampled to match the coordinate system defined by “kernelUnitLengih” prior to 
convolution, or resampled to match the device coordinate system after convolution, it is recommended that high 
quality vievvers make use of appropriate interpolation techniques, for example bilinear or bicubic. Depending on 
the speed of the available interpolents, this choice may be affected by the “image-rendering” property setting. Note 
that implementations might choose approaches that minimize or eliminate resampling vvhen not necessary to pro- 
duce proper results, such as vvhen the document is zoomed out such that “kernelUnitLength” is considerably smaller 
than a device pixel. 


Categories: “feConvolveMatrix” 
Filter primitive element 


Content model: 
Any number of the follovving elements, in any order: 
“animate” 


“set” 


Attributes: 
core attributes 
presentation attributes 
filter primitive attributes 
“class” 
“style” 
“n” 
“order” 
“kernelMatrix” 
“divisor” 
“bias” 
“targetX” 
“targetY” 
“edgeMode” 
“kernelUnitLength” 
“preserveAlpha” 


DOM Tnterfaces: 
SVGFEConvolveMatrixElement 
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Attribute definitions: 


order £ "-number-optional-number”" 

Imndicates the number of cells in each dimension for “kernelMatrix”. The values provided must be -integer”s 
greater than zero. The first number, -orderX”, indicates the number of columns in the matrix. The second 
number, -orderY?, indicates the number of rovvs in the matrix. If -orderY” is not provided, it defaults to 
xorderXo. 

A typical value is order-"3". It is recommended that only small values (e.g., 3) be used: higher values may 
result in very high CPU overhead and usually do not produce results that Pustify the impact on performance. 
If the attribute is not specifted, the effect is as if a value of 3 vvere specifted. 





Animatable: yes. 


kernelMatrix — "-list of numbers?" 
The İist of -number”s that make up the kernel matrix for the convolution. Values are separated by space 
characters and/or a comma. The number of entries in the list must equal -orderX” times -orderY?. 
Animatable: yes. 


divisor - "-number-" 
After applying the “kernelMatrix” to the input image to yield a number, that number is divided by “divisor” 
to yield the final destination color value. A divisor that is the sum of all the matrix values tends to have an 
evening effect on the overall color intensity of the result. İt is an error to specify a divisor of zero. The default 
value is the sum of all values in kernelMatrix, vvith the exception that if the sum is zero, then the divisor is 
set to 1. 
Animatable: yes. 


bias - "-number”" 
After applying the “kernelMatrix” to the input image to yield a number and applying the “divisor,, the “bias” 
attribute is added to each component. One application of “bias” is vvhen it is desirable to have .5 gray value 
be the zero response of the filter. The bias property shifis the range of the filter. This allovvs representation of 
values that vvould othervvise be clamped to 0 or 1. İf "bias” is not specifted, then the effect is as if a value of 0 
vvere specified. 
Animatable: yes. 


targetX - "-integer-" 
Determines the positioning in X of the convolution matrix relative to a given target pixel in the input image. 
"The leftmost column of the matrix is column number zero. The value must be such that: 0 -- targetX - or- 
derX. By default, the convolution matrix is centered in X over each pixel of the input image (i.e., targetX - 


floor ( orderX / 2 )). 
Animatable: yes. 


targetY - "-integer-" 
Determines the positioning in Y of the convolution matrix relative to a given target pixel in the input image. 
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"The topmost rovv of the matrix is rovv number zero. The value must be such that: 0 -— targetY - orderY. By 
default, the convolution matrix is centered in Y over each pixel of the input image (i.e., targetY - floor ( or- 
derY / 2 )). 

Animatable: yes. 


edgeMode £ "duplicate İ vvrap İ none" 
Determines hovr to extend the input image as necessary vvith color values so that the matrix operations can 
be applied vvhen the kermel is positioned at or near the edge of the input image. 





"duplicate" indicates that the input image is extended along each of its borders as necessary by duplic- 
ating the color values at the given edge of the input image. 


Original N-by-M image, vhere m-M-1 and nzN-1: 


11 12 ... 1m 1M 

21 22 ... 2m 2M 

n1 n2 ... nm nM 

NI N2 ... Nm NM 

Extended by tuo pixels using "duplicate": 

11111 11 12 ... 1m 1M 1M 1M 
1111 11 12 ... 1m 1M 1M 1M 
1111 11 12 ... 1m 1M 1M 1M 
2121 2122... 2m 2HM 2M 2M 
n1 n1 n1 n2 ... nm nM nM nM 
NI NI N1N2 ... Nm NM MAMAM 
NI NI N1N2 ... Nm NM MAMAM 
NI NI N1N2... Nm NM MAMAM 


"vvrap" indicates that the input image is extended by taking the color values from the opposite edge of the 
image. 


Extended by tuvo pixels using "urap": 
nm nM n1 n2 ... nm nM n1 n2 


Nm NM N11N2... Nm AM N1N2 
1m 1M 11 12 ... 1m 1M 11 12 
2m 2M 21 22 ... 2m 2M 21 22 
nm nM n1 n2 ... nm nM n1:n2 
Nm NM N11N2... Nm AM N1N2 
1m 1M 11 12 ... 1m 1M 11 12 
2m 2M 21 22 ... 2m 2M 21 22 


"none" indicates that the input image is extended vvith pixel values of zero for R, G, Band A. 
If attribute “edgeMode is not specifted, then the effect is as if a value of duplicate vvere specifted. 
Animatable: yes. 
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kernelUnitLength — "-number-optional-number”" 
The first number is the -dx” value. The second number is the -dyz value. If the -dy” value is not specifted, 
it defaults to the same value as -dx”. Indicates the intended distance in current filter units (i.e., units as de- 
termined by the value of attribute “primitiveUnits”) betvveen successive columns and rovvs, respectively, in 
the “kernelMatrix”. By specifying value(s) for “kernelUnitLengith”, the kernel becomes defined in a scalable, 
abstract coordinate system. İf “kernelUnitLengih” is not specifted, the default value is one pixel in the off- 
screen bitmap, vvhich is a pixel-based coordinate system, and thus potentially not scalable. For some level of 
consisteney across display media and user agenits, it is necessary that a value be provided for at least one of 
“filterRes” and “kernelUnitLengih”. In some implementations, the most consistent results and the fastest per- 
formance vvrill be achieved if the pixel grid of the temporary offsereen images aligns vvith the pixel grid of 
the kernel, 
A negative or zero value is an error (see Error processing). 
Animatable: yes. 


preserveAtTpha z "false I true" 
A value of false indicates that the convolution vvill apply to all channels, including the alpha channel. In this 
case the ALPHAx, y of the convolution formula for a given pixel is: 
ALPHAx,Y £ ( 
SUM 1-0 to TorderY-11 ( 
SUM 2-0 to TorderX-11 1 
SOURCE X-targetX-7, Y-targetyaıl ” kernelMatrixorderX-1-1, oorderY-I-1 
) 
) 


)/ divisor 4 bias 


A value of true indicates that the convolution vvill only apply to the color channels. m this case, the filter 
vvill temporarily unpremultiply the color component values, apply the kernel, and then re-premulltiply at the 


end. In this case the ALPHAx, y of the convolution formula for a given pixel is: 
ALPHAx,Y “ SOURCEX,Y 
If PpreserveAlpha” is not specified, then the effect is as if a value of false vvere specifted. 


Animatable: yes. 


15.14 Filter primitive “feDiffuseLighting” 


"This filter primitive lighis an image using the alpha channel as a bump map. The resulting image is an RGBA 
opaque image based on the light color vvith alpha - 1.0 everyvvhere. The lighting caleulation follovvs the standard 
diffuse component of the Phong lighting model. The resulting image depends on the light color, light position and 
surface geometry of the input bump map. 

The light map produced by this filter primitive can be combined vvith a texture image using the multiply term 
of the arifhmetic “feComposite” compositing method. Multiple light sources can be simulated by adding several of 
these light maps together before applying it to the texture image. 

The formulas belovv make use of 3x3 filters. Because they operate on pixels, such filters are inherently 
resolution-dependent. To make “feDiffuseLighting” produce resolution-independent resulis, an explicit value should 
be provided for either the “filterRes” attribute on the “filter” element and/or attribute “kernelUnitLengih”. 


“kernelUnitLengih”, in combination vvith the other attributes, defines an implicit pixel grid in the filter effecis 
coordinate system (i.e., the coordinate system established by the "primitiveUnits” attribute). If the pixel grid estab- 
lished by “ernelUnitLengih” is not scaled to match the pixel grid established by attribute “filterRes” (implicitly or 
explicitly), then the input image vvill be temporarily rescaled to match its pixels vvith “kernelUnitLength”. The 3x3 
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filters are applied to the resampled image. After applying the filter, the image is resampled back to its original res- 
olution. 

VVhen the image must be resampled, it is recommended that high quality vievvers make use of appropriate 
interpolation techniques, for example bilinear or bicubic. Depending on the speed of the available interpolents, 
this choice may be affected by the “image-rendering” property setting. Note that implementations might choose ap- 
proaches that minimize or eliminate resampling vvhen not necessary to produce proper results, such as vvhen the 
document is zoomed out such that “kernelUnitLengih” is considerably smaller than a device pixel, 


For the formulas that follovv, the Norm(Ax, Ay ,Az) function is defined as: 
Norm(Ak ,Ay,Az) z sqrt(Ax724Ay”24Az”2) 





The resulting RGBA image is computed as follovvs: 
Dr z ka “ ML” LE: 


Dg z ka ” N.L ” Lg 
Db ze ka ” N.L ” b 
Da e 1.0 

vvhere 


ka - diffuse lighting constant 

N - surface normal unit vector, a function of x and y 

L - unit vector pointing from surface to light, a function of x and y in the point and spot light cases 
Lr,Lg,Lb - RGB componenits of light, a function of x and y in the spot light case 


N is a function of x and y and depends on the surface gradient as follovvs: 


The surface described by the input alpha image İ(x,y) is: 
Z (x,y) c surfaceScale ” I(x,y) 


Surface normal is calculated using the Sobel gradient 3x3 filter. Different filter kernels are used depending on 


vvhether the given pixel is on the interior or an edge. For each case, the formula is: 
N, (x,y)z - surfaceScale ” FACTOR, ” 

(Kx (0 ,0)“1(x-dx,y-dy) F Kx(1,0)”1(x,y-dy) F Kx(2,0 
Kx(0,1)”1(x-dx,y) vk Kx(1,1)”1(x,y) o Kx(2,1)”1(xadx,y) z 
Kx(0,2)”1(x-dx,yady) £ Kx(1,2)“1(x,yady) £ Kx(2,2 

Ny (x,y)z - surfaceScale ” FACTORy ” 
(Ky(0,0)”1(x-dx,y-dy) 4 Ky(1,0)”1(x,y-dy) 4 Ky(2,0 
Ky (0,1)“1(x-dx,y) k Ky(1,1)”1(x,y) € Ky(2,1)”1(xadx,y) z 
Ky (0,2)“1(x-dx,yady) 4 Ky(1,2)”1(x,yady) £ Ky(2,2 

N, (x,y) e 1.0 


N - (N,, Ny, Nz) / Norm((Nx,Ny,Nz)) 


m these formulas, the dx and dy values (e.g., 1(x-dx,y-dy)), represent deltas relative to a given (x,y) position for 
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the purpose of estimating the slope of the surface at that point. These deltas are determined by the value (explicit 
or implicit) of attribute “kernelUnitLengih”. 






op/right corner: 


op/left corner: 


FACTORxz2/ (3”dx) 









FACTORxe2/ (3Ydx) FACTORxe1/ (3Y7dx) 


FACTORye2/ (3:"dy) 


Ky -. Ky — 


Left column: 

FACTORxe1/ (2”d3x) 
İ-i 1-9l 
I -2 2 öl 
İəl 1-0) 


FACTORye1/ (3”dy) 
Ky vəl 





Bottom/left corner: Bottom/right corner: 





FACTORxe2/ (3“dx) FACTORxz2/ (3”dx) 






FACTORye2/ (3”"dy) 
Ky — 





















-1 -2 0 
12:56 
0 0 0 





L, the unit vector from the image sample to the light, is calculated as follovvs: 


For Infinite light sources it is constant: 

Lx e cos(azimuth ) ”cos(elevation) 
sin(azimuth ) “cos(elevation) 
sin(elevation) 


Ly 
Lz 


For Point and spot lights it is a function of position: 
L, x Lightx -X 

Lighty s. 

Lights - Z(x,y) 


Ly 
İz 


L - (Lx, Ly, Lz) / Norm(Lx, Ly, Lz) 


vvhere Lightx, Lighty, and Light, are the input light position. 
L.Lz.Lb, the light color vector, is a function of position in the spot light case only: 
Lr e Lightr”pov((-L.S),specularExponent) 
Lightg”pov/ ( (-L.S) ,specularExponent) 
Lightpb”pov( (-L.S) ,specularExponent) 
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Lg 
Lb 


vvhere S is the unit vector pointing from the light to the point (pointsAtX, pointsAtY, pointsAtZ) in the x-y plane: 
S, - pointsAtX - Lightxk 

pointsAtY - Lighty 

pointsAtZ - Lightz 


Sy 


Sz 


S - (S,, Sy, Sz) / Norm(Sx, Sy, Sz) 





IF L.S is positive, no light is present. (Lr - Lg - Lp - 0). If “limitingConeAngle” is specifled, -L.S - 
cos(limitingConeAngle) also indicates that no light is present. 


Categories: “TeDiffuseLighting” 


Filter primitive element 


Content model: 
Any number of descriptive elements and exactly one light source element, in any order. 


Attributes: 
core attributes 
presentation attributes 
filter primitive attributes 
“class” 
“style” 
“n” 
“surfaceScale” 
“diffuseConstant” 
“kernelUnitLength” 


DOM Tnterfaces: 
SVGFEDiffuseLightingElement 


Attribute definitions: 


surfaceScale — "-number”" 
height of surface vvhen Ain - 1. 
If the attribute is not specifted, then the effect is as if a value of 1 vvere specifted. 
Animatable: yes. 
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diffuseConstant - "-number”" 
kd in Phong lighting model, In SVG, this can be any non-negative number. 
If the attribute is not specifted, then the effect is as if a value of 1 vvere specifted. 
Animatable: yes. 


kernelUnitLength — "-number-optional-number”" 
The first number is the -dx” value. The second number is the -dy” value. If the -dy” value is not specifted, 
it defaults to the same value as -dxə. Indicates the intended distance in current filter units (i.e., units as 
determined by the value of attribute “primitiveUnits”) for dx and dy, respectively, in the surface normal cal- 
culation formulas. By specifying value(s) for “kernelUnitLengih”, the kernel becomes defined in a scalable, 
abstract coordinate system. If “kernelUnitLength” is not specifted, the dx and dy values should represent very 
small deltas relative to a given (x,y) position, vvhich might be implemented in some cases as one pixel in 
the intermediate image offsereen bitmap, vvhich is a pixel-based coordinate system, and thus potentially not 
scalable. For some level of consisteney across display media and user agenis, it is necessary that a value be 
provided for at least one of “filterRes” and “kernelUnitLengih”. Discussion of intermediate images are in the 
Imtroduction and in the description of attribute “filterRes”. 
A negative or zero value is an error (see Error processing). 
Animatable: yes. 


The light source is defined by one of the child elements “TeDistantLighf, “fePoiniLight” or “feSpotLight”. The light 
color is specifled by property “lighting-color”. 


15.15 Filter primitive “eDisplacementMap” 


"This filter primitive uses the pixels values from the image from “in?” to spatially displace the image from “in”. This 


is the transformation to be performed: 


P"(x,y) c€- P( x “ scale ” (XC(x,y) - .5), y £ scale ” (YC(x,y) - .5)) 


vvhere P(x,y) is the input image, “in, and P"(x,y) is the destination. XC(x,y) and YC(x,y) are the component values 
of the channel designated by the xChannelSelector and yChannelSelector. For example, to use the R component of 
“in2” to control displacement in x and the G component of Tmagez2 to control displacement in y, set xChannelSelect- 
or to "R" and yChannelSelector to "G". 

The displacement map defines the inverse of the mapping performed. 

The input image in is to remain premulliplied for this filter primitive. The caleulations using the pixel values 
from “in2” are performed using non-premultiplied color values. If the image from “in?” consists of premultiplied 
color values, those values are automatically converted into non-premultiplied color values before performing this 
operation. 

This filter can have arbitrary non-localized effect on the input vvhich might require substantial buffering in 
the processing pipeline. Hovvever vvith this formulation, any intermediate buffering needs can be determined by 
scale vrhich represents the maximum range of displacement in either x or y. 

VVhen applying this filter, the source pixel location vvill often lie betvveen several source pixels. In this case 


it is recommended that high quality vievvers apply an interpolent on the surrounding pixels, for example bilinear 
or bicubic, rather than simply selecting the nearest source pixel. Depending on the speed of the available inter- 
polents, this choice may be affected by the “image-rendering” property setting. 

The “color-interpolation-filters” property only applies to the “in2” source image and does not appİy to the “in” 
source image. The “in” source image must remain in its current color space. 
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Categories: “feDisplacementMap” 
Filter primitive element 


Content model: 
Any number of the follovving elements, in any order: 
“animate” 


“set” 





Attributes: 
core attributes 
presentation attributes 
filter primitive attributes 
“class” 


“style” 


“in2” 
“scale” 
“xChannelSelector” 


“yChannelSelector” 


DOM Tnterfaces: 
SVGFEDisplacementMapElement 


Attribute definitions: 


scale - "-number”" 
Displacement scale factor. The amount is expressed in the coordinate system established by attribute “prim- 
itiveUnits” on the “filter” element. 
VVhen the value of this attribute is 0, this operation has no effect on the source image. 
If the attribute is not specifted, then the effect is as if a value of 0 vvere specifted. 
Animatable: yes. 


xChannelselector - "R/ G/ BİA" 
Imdicates vvhich channel from “in?” to use to displace the pixels in “in” along the x-axis. If attribute “xChan- 
nelSelector” is not specifted, then the effect is as if a value of A vvere specifted. 
Animatable: yes. 
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yChannelSelector - "R/ G/B/A" 
Imdicates vvhich channel from “in?” to use to displace the pixels in “in” along the y-axis. If attribute “yChan- 
nelSelector” is not specifted, then the effect is as if a value of A vvere specifted. 
Animatable: yes. 


in2 - "(see “in” attribute)" 
"The second input image, vvhich is used to displace the pixels in the image from attribute “in”. This attribute 
can take on the same values as the “in” attribute. 
Animatable: yes. 


15.16 Filter primitive “feFlood” 


"his filter primitive creates a rectangle filled vvith the color and opacity values from properties “flood-color” and 
“flood-opacity”. The rectangle is as large as the filter primitive subregion established by the “x”, “y”, “vidth” and 
“height” attributes on the “feFlood” element. 


Categories: “TeFlood” 
Filter primitive element 


Content model: 
Any number of the follovving elements, in any order: 
“animate” 
“animateColor” 


“set” 


Attributes: 
core attributes 
presentation attributes 
filter primitive attributes 
“class” 
“style” 

DOM Interfaces: 
SVGFEFloodElement 


"The “flood-color” property indicates vvhat color to use to flood the current filter primitive subregion. The keyvvord 
currentColor and ICC colors can be specifted in the same manner as vvithin a -paint” specification for the “fillP and 


“stroke” properties. 


Value: currentColor İ 
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ccolorə İcicccolor?1 1 


inherit 
lnitial: black 
Applies to: “feFlood” elements 
Inherited: no 
Percentages: N/A 
Media: visual 


Animatable: yes 


"The “flood-opacity” property defines the opacity value to use across the entire filter primitive subregion. 


Value: xopacity-values İl inherit 
lnitial: 1 

Applies to: “feFlood” elements 
Inherited: no 

Percentages: N/A 

Media: visual 


Animatable: yes 


15.17 Filter primitive “feGaussianBlur” 


"This filter primitive performs a Gaussian blur on the input image. 
The Gaussian blur kernel is an approximation of the normalized convolution: 
G(x,y) e H(x)1(y) 


vvhere 
exp(-x?/ (2s7)) / sqrt(2“ pis?) 


s 
x 
ıı 


1(y) - exp(-y”/ (2t7)) / sqrt(2” pi”t?) 


vvith "s" being the standard deviation in the x direction and "t" being the standard deviation in the y direction, as 
speciftled by “stdDeviation”. 

The value of “stdDeviation” can be either one or tvvo numbers. If tvvo numbers are provided, the first number 
represents a standard deviation value along the x-axis of the current coordinate system and the second value rep- 
resents a standard deviation in Y. If one number is provided, then that value is used for both X and Y. 

Even if only one value is provided for “stdDeviation”, this can be implemented as a separable convolution. 

For larger values of "s" (s s 2.0), an approximation can be used: Three successive box-blurs build a piece-vvise 


quadratic convolution kernel, vvhich approximates the Gaussian kernel to vvithin roughly 37. 
let d z- floor(s ” 3“sqrt(2“pi)/4 4 0.5) 


... if d is odd, use three box-blurs of size "d, centered on the output pixel. 
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.. if d is even, tvvo box-blurs of size "d" (the first one centered on the pixel boundary betvveen the output pixel 
and the one to the left, the second one centered on the pixel boundary betvveen the output pixel and the one to the 
right) and one box blur of size "d-1" centered on the output pixel. 


Note: the approximation formula also applies correspondingly to "t". 


Frequently this operation vvill take place on alpha-only images, such as that produced by the built-in input, 
SourceAlpha. The implementation may notice this and optimize the single channel case. If the input has infinite ex- 
tent and is constant (e.g FillPaint vvhere the fill is a solid color), this operation has no effect. If the input has infinite 
extent and the filter result is the input to an “feTile”, the filter is evaluated vvith periodic boundary conditions. 


Categories: “feGaussianBlur” 
Filter primitive element 


Content model: 
Any number of the follovving elements, in any order: 
“animate” 


“set” 


Attributes: 
core attributes 
presentation attributes 
filter primitive attributes 
“class” 
“style” 


ın 


“stdDeviation” 


DOM Interfaces: 
SVGFEGaussianBlurElement 


Attribute definitions: 


stdDeviation — "-number-optional-number”" 
"The standard deviation for the blur operation. If tvvo -number”s are provided, the first number represents a 
standard deviation value along the x-axis of the coordinate system established by attribute "primitiveUnits” 
on the “filter” element. The second value represents a standard deviation in Y. If one number is provided, then 
that value is used for both X and Y. 
A negative value is an error (see Error processing). A value of zero disables the effect of the given filter prim- 
itive (i.e., the result is the filter input image). If “sidDeviation” is 0 in only one of X or Y, then the effect is that 
the blur is only applied in the direction that has a non-zero value. 
If the attribute is not specifted, then the effect is as if a value of 0 vvere specifted. 
Animatable: yes. 
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The example at the start of this chapter makes use of the “feGaussianBlur” filter primitive to create a drop shadovv 
effect. 


15.18 Filter primitive “felmage” 


"This filter primitive refers to a graphic external to this filter element, vvhich is loaded or rendered into an RGBA 
raster and becomers the result of the filter primitive. 

This filter primitive can refer to an external image or can be a reference to another piece of SVG. It produces 
an image similar to the built-in image source SourceGraphic except that the graphic comes from an external source. 

If the “xlink-href” references a stand-alone image resource such as a IPEG, PNG or SVG file, then the image re- 
source is rendered according to the behavior of the “image” element: othervvise, the referenced resource is rendered 
according to the behavior of the “use” element. In either case, the current user coordinate system depends on the 
value of attribute “primitiveUnits” on the “filter” element. The processing of the “preserveAspectRatio” attribute on 
the “Telmage” element is identical to that of the “image” element. 

VVhen the referenced image must be resampled to match the device coordinate system, it is recommended 
that high quality vievvers make use of appropriate interpolation techniques, for example bilinear or bicubic. 
Depending on the speed of the available interpolents, this choice may be affected by the “image-rendering” property 
setting. 


Categories: “felmage” 
Filter primitive element 


Content model: 
Any number of the follovving elements, in any order: 
“animate” 
“animateTransform” 


“set” 


Attributes: 
core attributes 
presentation attributes 
filter primitive attributes 
xlink attributes 
“class” 
“style” 
“externalResourcesRequired” 
“preserveAspectRatio” 


“xlink:href” 


DOM TInterfaces: 
SVGFElmageElement 


Attribute definitions: 


xlink:href — "-iri-" 
An IRI reference to the image source. 
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Animatable: yes. 


preserveAspectRatio — "İdeferl -align- T-meetOrsSlice-1" 
See “preserveAspectRatio”. 
If attribute “preserveAspectRatio” is not specifted, then the effect is as if a value of xMidYMid meet vvere 
specifted. 
Animatable: yes. 


Example felmage illustrates hovv images are placed relative to an obfect. From left to right: 





e "The default placement of an image. Note that the image is centered in the filter region and has the maximum 
size that vvill fit in the region consistent vvith preserving the aspect ratio. 

e “he image stretched to fit the bounding box of an obiect. 

e "he image placed using user coordinates. Note that the image is first centered in a box the size of the filter 
region and has the maximum size that vvill fit in the box consistent vvith preserving the aspect ratio. This box 
is then shifted by the given "x" and "y" values relative to the vievvport the obfect is in. 


s€svg vidth-"600" height-"250" vievBoxz"0 0 600 250" 
xmlnsz"http: / /vvv .vV3.0T9/2000/svg" 
xmlns:xlinke"http://uvv/.v3.org/1999/xl1ink"s 

etitlesExample felmage - Examples of felmage usec/titles 
cdescsThree examples of using felmage, the first shoving the 
default rendering, the second shoving the image fit 
to a box and the third shoving the image 
shifted and clipped.-/desc” 
edefso 
efilter id-"Default"x 
efelmage xlink:href-"smiley.png" / 
e/filters 
efilter id-"Fitted" primitiveUnits-"obiectBoundingBox"x 
cfelmage xlink:href-"smiley.png" 
xz"ğ" y-"0" vidth-"1005" height-"1008-" 
preserveAspectRatioz"none"/x 
e/filters 
efilter id-"Shifted"- 
efelmage xlink:href-"smiley.png" 
xz"500" ya"5"/5 
e/filters 
xe/defss 
erect fill-"none" strokez"blue" 
xz"1" ye"1" vidth-"598" height-"248"/5 
cg” 
crect xse"50" ye-"25" vidth-"100" height-"200" filter-"ur1(£Default)"/s 
crect xe"50" yez"25" vidth-"100" height-"200" fill-"none" strokez"green"/5 
crect xz"250" yz-"25" vidth-"100" height-"200" filter-"url(FFitted)"/x 
crect xze"250" y-"25" vidth-"100" height-"200" fill-"none" strokez"green"/s 
crect xz"450" y-"25" vidth-"100" height-"200" filter-"ur1(£Shifted)"/s 
crect xze"450" y-"25" vidth-"100" height-"200" fill-"none" strokez"green"/s 
x/g” 
s/ svg” 
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Example felmage 





15.19 Filter primitive “feMerge” 


"This filter primitive composites input image layers on top of each other using the over operator vvith Input1 (cor- 
responding to the first “feMergeNode” child element) on the bottom and the last specifted input, InpufN (corres- 
ponding to the last “feMergeNode” child element), on top. 

Many effects produce a number of intermediate layers in order to create the final output image. This filter 
allovvs us to collapse those into a single image. Although this could be done by using n-1 Composite-filters, it is 
more convenient to have this common operation available in this form, and offers the implementation some addi- 
tional flexibility. 

Each “TeMerge” element can have any number of “feMergeNode” subelements, each of vvhich has an “in” attrib- 
ufe. 

The canonical implementation of feMerge is to render the entire effect into one RGBA layer, and then render 
the resulting layer on the output device. İn certain cases (in particular if the output device itself is a continuous 
tone device), and since merging is associative, it might be a sufficient approximation to evaluate the effect one 
layer at a time and render each layer individually onto the output device bottom to top. 

If the topmost image input is SourceGraphic and this “feMerge” is the last filter primitive in the filter, the im- 
plementation is encouraged to render the layers up to that point, and then render the SourceGraphic directly from 


its vector description on top. 


Categories: “feMerge” 
Filter primitive element 


Content model: 
Any number of the follovving elements, in any order: 
“feMergeNode” 
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Attributes: 
core attributes 
presentation attributes 
filter primitive attributes 
“class” 


“style” 


DOM Tnterfaces: 
SVGFEMergeElement 


Categories: “feMergeNode” 
None 


Content model: 
Any number of the follovving elements, in any order: 
“animate” 


“set” 


Attributes: 
core attributes 
“in” 

DOM Tnterfaces: 
SVGFEMergeNodeElement 


The example at the start of this chapter makes use of the “feMerge” filter primitive to composite tvvo intermediate 
filter results together. 


15.20 Filter primitive “feMorphology” 


"This filter primitive performs "fattening" or "thinning" of artvvork. İt is particularly useful for fattening or thinning 
an alpha channel, 

The dilation (or erosion) kernel is a rectangle vvith a vvidth of 2”x-radius and a height of 2”y-radius. In dila- 
tion, the output pixel is the individual component-vvise maximum of the corresponding R,G,B,A values in the 
input images kernel rectangle. In erosion, the output pixel is the individual component-vvise minimum of the cor- 
responding R,G,B,A values in the input images kernel rectangle. 

Frequently this operation vvill take place on alpha-only images, such as that produced by the built-in input, 
SourceAlpha. In that case, the implementation might vvant to optimize the single channel case. 

If the input has infinite extent and is constant (e.g FillPaint vvhere the fill is a solid color), this operation has 
no effect. If the input has infinite extent and the filter result is the input to an “feTile”, the filter is evaluated vvith 
periodic boundary conditions. 


Because “feMorphology” operates on premultipied color values, it vvill alvvays result in color values less than 


or equal to the alpha channel. 


Categories: “feMorphology” 
Filter primitive element 
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Content model: 
Any number of the follovving elements, in any order: 
“animate” 


“set” 


Attributes: 
core attributes 
presentation attributes 





filter primitive attributes 
“class” 

“style” 

“n” 

“operator” 


“radius” 


DOM Tnterfaces: 
SVGFEMorphologyElement 


Attribute definitions: 


operator — "erode l dilate" 
A keyvvord indicating vvhether to erode (i.e., thin) or dilate (fatten) the source graphic. If attribute “operator” 


is not specifted, then the effect is as if a value of erode vvere specifted. 
Animatable: yes. 


radius — "-number-optional-number”" 
"The radius (or radii) for the operation. If tvvo -number”s are provided, the first number represents a x-radius 
and the second value represents a y-radius. If one number is provided, then that value is used for both X and 
Y. The values are in the coordinate system established by attribute "primitiveUnits” on the “filter” element. 
A negative value is an error (see Error processing). A value of zero disables the effect of the given filter prim- 
itive (i.e., the result is a transparent black image). 
If the attribute is not specifted, then the effect is as if a value of 0 vvere specifted. 


Animatable: yes. 


Example feMorphology shovvs examples of the four types of feMorphology operations. 


c?xml versionze"1.0"?25 
xc DOCTYPE svg PUBLİC "-//V/3C/ /DTD SVG 1.1//EN" 
"http: / /uvvv .vV3.org/Graphics/SVG/1.1/DTD/svg11.dtd" 
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s€svg vidth-"5cm" height-"7cm" vievBoxz"0 0 700 500" 
xmlnsze"http: / /vv/ .vV3.0T9/2000/svg" versionz"1.1"5 
etitlesExample feMorphology - Examples of erode and dilatec/titles 
edescsFive text strings dravn as outlines. 
The first is unfiltered. The second and third use "erode". 
The fourth and fifth use "dilate".-/desc” 
edefso 
efilter id-"Erode3"- 
efeMorphology operatorz"erode" inz"SourceGraphic" radiusze"3" /s 
e/filter- 
efilter id-"Erode6"- 
efeMorphology operatorz"erode" inz"SourceGraphic" radiusze"6" /s5 
e/filter- 
efilter id-"Dilate3"5 
efeMorphology operatore"dilate" in-"SourceGraphic" radiusz"3" /s 
e/filters 
efilter id-"Dilate6"- 
efeMorphology operatore"dilate" in-"SourceGraphic" radiusz"6" /s 
e/filter- 
s/defss 
erect fill-"none" strokeze"blue" stroke-vidth-"2" 
xz"1" yz"1" vidth-"698" height-"498"/5 
sg enable-backgrounde"nev" x 
s€g font-family-"Verdana" font-sizez"75" 
fill-"none" strokee"black" stroke-vidthz"6" s 
etext xe"50" ye"90"sUnfiltered-c/text” 
etext xe"50" ye"180" filter-"ur1(£Erode3)" sErode radius 3-/textəe 
etext xe"50" ye"270" filter-"ur1(£Erode6)" sErode radius 6-/textə” 
etext xe"50" y-"360" filter-"url1(£Dilate3)" sDilate radius 3-/text” 
etext xe"50" ye"450" filter-"url1(£Dilate6)" sDilate radius 6-/text” 
x/g” 
x/g” 
x/svg” 


Example feMorphology 


Unfiltered 

Erode radlus 3 
Erode radlusş 6 
Dilate radius 3 
Dilata radlus 6 





15.21 Filter primitive “feOffset” 


"This filter primitive offsets the input image relative to its current position in the image space by the specified vec- 
tor. 

This is important for effects like drop shadovvs. 

VVhen applying this filter, the destination location may be offset by a fraction of a pixel in device space. In 


this case a high quality vievver should make use of appropriate interpolation techniques, for example bilinear or 
bicubic. This is especially recommended for dynamic vievvers vvhere this interpolation provides visually smoother 
movement of images. For static vievvers this is less of a concern. Close attention should be made to the “image-ren- 
dering” property setting to determine the authors intent. 
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Categories: “TeOffset” 
Filter primitive element 


Content model: 
Any number of the follovving elements, in any order: 
“animate” 


“set” 


Attributes: 
core attributes 
presentation attributes 
filter primitive attributes 





“class” 


“style” 


DOM Interfaces: 
SVGFEOffsetElement 


Attribute definitions: 


dx — "-number-" 
"The amount to offset the input graphic along the x-axis. The offset amount is expressed in the coordinate 
system established by attribute "primitiveUnits” on the “filter” element. 
If the attribute is not specifted, then the effect is as if a value of 0 vvere specifted. 
Animatable: yes. 


dy - "-number-" 
"The amount to offset the input graphic along the y-axis. The offset amount is expressed in the coordinate 
system established by attribute "primitiveUnits” on the “filter” element. 
If the attribute is not specifted, then the effect is as if a value of 0 vvere specifted. 
Animatable: yes. 


The example at the start of this chapter makes use of the “feOfiset” filter primitive to offset the drop shadovv from 
the original source graphic. 
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15.22 Filter primitive “feSpecularLighting” 


"This filter primitive lights a source graphic using the alpha channel as a bump map. The resulting image is an 
RGBA image based on the light color. The lighting caleulation follovvs the standard specular component of the 
Phong lighting model, The resulting image depends on the light color, light position and surface geometry of the 
input bump map. The result of the lighting calculation is added. The filter primitive assumes that the vievver is at 
infinity in the z direction (i.e., the unit vector in the eye direction is (0,0,1) everyvvhere). 

This filter primitive produces an image vvhich contains the specular reflection part of the lighting calculation. 
Such a map is intended to be combined vvith a texture using the add term of the arifhmetic “feComposite” method. 
Multiple light sources can be simulated by adding several of these light maps before applying it to the texture 
image. 

The resulting RGBA image is computed as follovvs: 

Sr z ks ” pov(N.H, specularExponent) ” Lr 


Sg “ ks ” pov(N.H, specularExponent) ” Lg 
Sb z ks ” pov(N.H, specularExponent) ” Lb 
Sa z max(Sr, Sg, Sb) 

vvhere 


kş - specular lighting constant 
N - surface normal unit vector, a function of x and y 
H - "halfvvay" unit vector betvveen eye unit vector and light unit vector 


Lr,Lg,Lb - RGB components of light 


See “TeDiffuseLighting” for definition of N and (Lr, Le, Lp). 


The definition of H reflects our assumption of the constant eye vector E - (0,0,1): 
H c (L r E) / Norn(L-E) 


vvhere L is the light unit vector. 

Unlike the “TeDiffuseLighting”, the “feSpecularLighting” filter produces a non-opaque image. This is due to the 
fact that the specular result (Sr,Se,Sp,Sa) is meant to be added to the textured image. 1he alpha channel of the result 
is the max of the color components, so that vvhere the specular light is zero, no additional coverage is added to the 
image and a fully vvhite highlight vvill add opacity. 

The “feDiffuseLighting” and “feSpecularLighting” filters vvill often be applied together. An implementation may 


detect this and caleulate both maps in one pass, instead of tvvo. 


Categories: “feSpecularLighting” 
Filter primitive element 


Content model: 
Any number of descriptive elements and exactly one light source element, in any order. 


Attributes: 
core attributes 
presentation attributes 
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filter primitive attributes 
“class” 

“style” 

“n” 

“surfaceScale” 
“specularConstant” 
“specularExponent” 


“kernelUnitLength” 





DOM Interfaces: 
SVGFESpecularLightingElement 


Attribute definitions: 


surfaceScale - "-numbers" 
height of surface vvhen Ain — 1. 
If the attribute is not specifted, then the effect is as if a value of 1 vvere specifted. 
Animatable: yes. 


specularConstant - "-numbers" 
ks in Phong lighting model. In SVG, this can be any non-negative number. 
If the attribute is not specifted, then the effect is as if a value of 1 vvere specifted. 
Animatable: yes. 


specularExponent - "-numbers" 
Exponent for specular term, larger is more "shiny". Range 1.0 to 128.0. 
If the attribute is not specifted, then the effect is as if a value of 1 vvere specifted. 
Animatable: yes. 


kernelUnitLength — "-number-optional-number”" 
"The first number is the -dx? value. The second number is the -dys value. If the -dy” value is not specifted, 
it defaults to the same value as -dxə. Indicates the intended distance in current filter units (i.e., units as 
determined by the value of attribute “primitiveUnits”) for dx and dy, respectively, in the surface normal cal- 
culation formulas. By specifying value(s) for “kernelUnitLengih”, the kernel becomes defined in a scalable, 
abstract coordinate system. If “kernelUnitLengüh” is not specifled, the dx and dy values should represent very 
small deltas relative to a given (x,y) position, vvhich might be implemented in some cases as one pixel in 
the intermediate image offscreen bitmap, vvhich is a pixel-based coordinate system, and thus potentially not 
scalable. For some level of consisteney across display media and user agenis, it is necessary that a value be 
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provided for at least one of “filterRes” and “kernelUnitLength”. Discussion of intermediate images are in the 
mtroduction and in the description of attribute “filterRes”. 

A negative or zero value is an error (see Error processing). 

Animatable: yes. 


"The light source is defined by one of the child elements “feDistantLight”, “fePointLighi” or “feDistantLight”. The light 
color is specifled by property “lighting-color”. 

The example at the start of this chapter makes use of the “feSpecularLighting” filter primitive to achieve a 
highly reflective, 3D glovving effect. 


15.23 Filter primitive “feTile” 


This filter primitive fills a target rectangle vvith a repeated, tiled pattern of an input image. The target rectangle 
is as large as the filter primitive subregion established by the “x”, "y”, “vidth” and “height” attributes on the “TeTile” 
element. 

Typically, the input image has been defined vvith its ovvn filter primitive subregion in order to define a ref- 
erence tile. “feTile” replicates the reference tile in both X and Y to completely fill the target rectangle. The top/left 
corner of each given tile is at location (xri"”vidth,y-?i”height), vvhere (x,y) represents the top/left of the input 
images filter primitive subregion, vidth and height represent the vvidth and height of the input images filter 
primitive subregion, and i and 1 can be any integer value. In most cases, the input image vvill have a smaller filter 
primitive subregion than the “feTile” in order to achieve a repeated pattern effect. 

Implementers must take appropriate measures in constructing the tiled image to avoid artifacts betvveen tiles, 
particularly in situations vvhere the user to device transform includes shear and/or rotation. Unless care is taken, 
interpolation can lead to edge pixels in the tile having opacity values lovver or higher than expected due to the 
interaction of painting adiacent tiles vvhich each have partial overlap vvith particular pixels. 


Categories: “TeTile” 
Filter primitive element 


Content model: 
Any number of the follovving elements, in any order: 
“animate” 


“set” 


Attributes: 
core attributes 
presentation attributes 
filter primitive attributes 
“class” 
“style” 


ın 
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DOM Tnterfaces: 
SVGFETileElement 


15.24 Filter primitive “feTurbulence” 


"This filter primitive creates an image using the Perlin turbulence function. It allovvs the synthesis of artificial tex- 
tures like clouds or marble. For a detailed description the of the Perlin turbulence function, see "Texturing and 
Modeling", Ebert et al, AP Professional, 1994. "he resulting image vvill fill the entire filter primitive subregion for 
this filter primitive. 

İt is possible to create bandvvidth-limited noise by synthesizing only one octave. 

The C code belovr shovvs the exact algorithm used for this filter effect. 

For fractalSum, you get a turbFunetionResult that is aimed at a range of -1 to 1 (the actual result might exceed 
this range in some cases). To convert to a color value, use the formula colorValue “ ( (turbFunctionResult ” 
255) “ 255) / 2, then clamp to the range 0 to 255. 

For turbulence, you get a turbFunctionResult that is aimed at a range of 0 to 1 (the actual result might exceed 
this range in some cases). To convert to a color value, use the formula colorValue - (turbFunctionResult ” 
255), then clamp to the range 0 to 255. 

The follovving order is used for applying the pseudo random numbers. An initial seed value is computed 
based on attribute “seed”. Then the implementation computes the lattice points for R, then continues getting ad- 
ditional pseudo random numbers relative to the last generated pseudo random number and computes the lattice 
points for G, and so on for B and A. 

The generated color and alpha values are in the color space determined by the value of property “color- 


interpolation-filters”: 


/” Produces results in the range 11, 2”“31 - 21. 

Algorithm is: r c (a “ r) modm 

vhere a z 16807 and m z 2F““31 - 1 — 2147483647 

See fPark 8 Millerl, CACM vol. 31 no. 10 p. 1195, Üct. 1988 
To test: the algorithm should produce the result 1043618065 
as the 10,000th generated number if the original seed is 1. 
kə/ 

adefine RAND m 2147483647 /” 25“31 - 1 “/ 

idefine RAND a 16807 /” 77855, primitive root of m ”/ 
ödefine RAND q 127773 /“ m / a ”/ 

adefine RAND r 2836 /” m $a ”/ 

1ong setup seed(1long 1Seed) 

( 


if (1Seed -- 0) 1Seed - -(lSeed 5. (RAND m - 1)) 41, 
if (1Seed 5 RAND nm - 1) 1seed z RAND nm - 1, 
return 1Seed, 
) 
long random(1ong 1Seed) 
( 
long result, 
result c RAND a ” (ISeed 5: RAND q) - RAND r ” (1Seed / RAND q), 
if (result -- 0) result 4 RAND m, 
return result, 
ı 
idefine BSize 0x100 
idefine BM Oxff 
idefine PerlinN 0x1000 
ödefine NP 12 /” 2”PerlinN “/ 
idefine NM öxfff 
static uLatticeSelectorİBSize 4 BSize - 21, 





static double fGradient1411BSize 4 BSize 4 21121, 
struct Stitchlinfo 
( 
int nMidth, // Hov much to subtract to vrap for stitching. 
int nHeight, 
int nurapX, // Minimum value to vrap. 
int nurapY, 
ıb 
static void init(long 1Seed) 
( 
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double s, 

int i, İ, k, 

TSeed setup seed(1Seed), 
for(k 0, k € 4, ke) 


for(i - 0, i c BSize, iz) 
1 
uLatticeSelectorlil ei, 
for ($ € 0, İ c 2? İH) 
TfGradientikllilli1 - (double) (((1Seed - random(1Seed)) $ (BSize 4 BSize)) - BSize) / BSize, 
s - double(sqrt(fGradientlkllil101 “ föradientikllil1101 4 fGradientikllil111 “ fGradientiklli1111)), 
fGradientilkllil101 /e s, 
TGradientIkllil111 /“ s, 
) 





vhile(--i) 

(1 
k z uLatticeSelectorlil, 
uLatticeSelectorlil - uLatticeSelector11 - (1Seed - random(1Seed)) “s BSizel, 
uLatticeSelector111 k, 

) 


for(i - 0, i o BSize H 2, i-H) 


1 
uLatticeSelectorİBSize 4 il - uLatticeSelectorlil, 
for(k z 0, k c 4, ku) 
Tfor(i € 0, 1 € 2, iH) 
fGradientlkl1İlBSize 4 illil — füöradientikllillil, 


) 
) 
idefine s curve(t) ( t” t” (3. -2.”t)) 
idefine lerp(t, a, b) ( art ” (b-a)) 
double noise2(int nColorChannel, double vec1l21, Stitchinfo “pStitchinfo) 
4 





int bx0, bx1, by0, byl, b00, b10, b01, b11, 
double rx0, rx1, ry0, ry1, “q, sx, sy, a, b, t, u, v, 
register i, İ, 





t - vecl01 - PerlinN, 
bx0 c- (int)t, 

bx1 — bx0-1, 

rx0 c t - (int)t, 

rx1 € rx0 - 1.01, 

t - vecilll - PerlinN, 
by - (int)t, 

by1 c- byö-l, 

ryü c t - (int)t, 

ry1 z ry0 - 1.0f, 

// If stitching, adfiust lattice points accordingly. 


if(pStitchinfo 1- NULL) 
( 


if(bx0 sz pStitchInfo--nurapX) 
bx0 -z- pStitchlInfo--nilidth, 
if(bx1 s pStitchlnfo--niurapX) 
bx1 -z- pStitchlInfo--nilidth, 
if(by0 s- pStitchlnfo--nirapY) 
by -- pStitchinfo--nHeight, 
if(byl s- pStitchlnfo--nirapY) 
by1 -- pStitchinfo--nHeight, 
) 


bx0 6 BM, 
bx1 6 BM, 
by0 6 BM, 
by1 6 BM, 
i - uLatticeSelector1lbx601, 
i - uLatticeSelector1İbx11, 


b00 - uLatticeSelectorli 4 byül, 
b10 - uLatticeSelectorl1i 4 by0l, 
b01 - uLatticeSelectorli 4 byl1l, 


11 - uLatticeSelectorli 4 byl11, 

x double(s curve(rx0)), 

y double(s curve(ry0)), 
TGradientinColorChanne111b0601, 
TGradientinColorChanne111b1601, 
lerp(sx, u, v), 
TGradientinColorChanne111b011, 
TGradientinColorChanne111b111, 
lerp(sx, u, v), 

return lerp(sy, a, b), 


c 


rx0 ” q101 
rx1 ” q101 


24: 


Ty0 ” q111, 
Ty0 “ q1I11, 


əs 
ap 


c 


rx0 ” q101 
rx1 ” q101 


zü 


ryl “ qI11), 
ry1 ” qI11) 


c 


eoncuLDLcLcumumu 
-. 
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) 

double turbulence(int nColorChannel, double “point, double fBaseFreqX, double fBaseFreqY, 
int nNumOctaves, bool bFractalSum, bool bDoStitching, 
double fTileX, double fTileY, double fTileMidth, double fTileHeight) 


StitchInfo stitch, 
Stitchinfo “pStitchinfo - NULL, // Not stitching vhen NULL. 
// Adfust the base frequencies if necessary for stitching. 
if(bDoStitching) 
1 
// Mhen stitching tiled turbulence, the frequencies must be adiusted 
// so that the tile borders vill be continuous. 
if(fBaseFreqX 1z 0.0) 
1 
double fLoFreq double(floor(fTileMidth “ fBaseFreqX)) / fTileMidth, 
double fHiFreq double(ceil(fTileMNidth “ fBaseFreqX)) / fTileMidth, 
if (fBaseFreqX / fLoFreq -c fHiFreq / fBaseFreqX) 
TBaseFreqX “ fLoFreq? 
else 
TBaseFreqX £ fHiFreq, 





) 
if (fBaseFreqY 1- 0.0) 
1 
double fLoFreq double(floor(fTileHeight “ fBaseFreqY)) / fTileHeight, 
double fHiFreq - double(ceil(fTileHeight ” fBaseFreqY)) / fTileHeight, 
if(fBaseFreqY / fLoFreq - fHiFreq / fBaseFreqY) 
TBaseFreqY - fLoFreq, 
else 
TBaseFreqY - fHiFreq, 
) 


// Set up initial stitch values. 

pStitchinfo c Sstitch, 

stitch.nMidth int(fTilellidth “ fBaseFreqX 4 0.51), 
stitch.nurapX - fTileX “ fBaseFreqX 4 PerlinN F£ stitch.nMidth, 
stitch.nHeight - int(fTileHeight “ fBaseFreqY 4 0.51), 
stitch.nulrapY - fTileY “ fBaseFreqY 4 PerlinN 4 stitch.nHeight, 


) 

double fSum 0.01, 

double vec121, 

vecl01 c point101 ” fBaseFreqoX, 

vecl11 € point1l11 ” fBaseFreqY, 

double ratio € 1, 

for(int nOctave £ 0, nüctave -c nNumOctaves, nüctaverk-r) 


1 
if(bFractalSum) 
fSum 4 double(noise2(nColorChannel, vec, pStitchinfo) / ratio), 
else 
TSum 4 double (fabs(noise2(nColorChannel, vec, pStitchlinfo)) / ratio), 
vecl01 ” 2, 
vecl1) ” 2, 
ratio ” 2, 
if(pStitchinfo 1- NULL) 
V 
// Update stitch values. Subtracting PerlinN before the multiplication and 
// adding it aftervard simplifies to subtracting it once. 
stitch.nlidth “— 2, 
stitch.nurapX - 2 ” stitch.nilrapX - PerlinN, 
stitch.nHeight ” 2, 
stitch.nurapY - 2 ” stitch.nilrapY - PerlinN, 
) 
) 


return fSum, 


) 


c 
.o 
5 
İy) 
m") 
(es 
(3) 
z 
E 
ə) 
(ə) 
o 
ad 
. 
: 





Categories: “feTurbulence” 


Filter primitive element 


Content model: 
Any number of the follovving elements, in any order: 
“animate” 


“set” 


Attributes: 
core attributes 
presentation attributes 
filter primitive attributes 
“class” 
“style” 
“baseFrequency” 
“numOctaves” 
“seed” 
“stitchTiles” 


“type” 


DOM Tnterfaces: 
SVGFETurbulenceElement 


Attribute definitions: 


baseFrequency “ "-number-optional-number”" 
"The base frequeney (frequencies) parameter(s) for the noise function. If tvvo -number:”s are provided, the 
first number represents a base frequeney in the X direction and the second value represents a base frequeney 
in the Y direction. If one number is provided, then that value is used for both X andY. 
A negative value for base frequeney is an error (see Error processing). 
If the attribute is not specifted, then the effect is as if a value of 0 vvere specifted. 
Animatable: yes. 


num0ctaves  "-infeger”" 
The numöOctaves parameter for the noise function. 
If the attribute is not specifted, then the effect is as if a value of 1 vvere specifted. 
Animatable: yes. 


seed - "-nnumber”" 
"The starting number for the pseudo random number generator. 
If the attribute is not specifted, then the effect is as if a value of 0 vvere specifted. VVhen the seed number is 
handed over to the algorithm above it must first be truncated, i.e. rounded to the closest integer value to- 


vvards zero. 
Animatable: yes. 


stitchTiles — "sfifch / noStitch" 
If stitchTiles-"noStitch", no attempt it made to achieve smooth transitions at the border of tiles vvhich contain 
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a turbulence function. Sometimes the result vvill shovv clear discontinuities at the tile borders. 

If stitdhTiles-"stitdh", then the user agent vvill automatically adiust baseFrequeney-x and baseFrequeney-y 
values such that the feTurbulence noders vvidth and height (i.e., the vvidth and height of the current sub- 
region) contains an integral number of the Perlin tile vvidth and height for the first octave. The baseFre- 
queney vvill be adiusted up or dovvn depending on vvhich vvay has the smallest relative (not absolute) 
change as follovvs: Given the frequencey, calculate 1ovFreq-T1oor (vidth”frequency)/vidth and hiFre- 
q-ceil(uvidth”frequency) /vidth. If frequency/lovvFreq - hiFreq/frequeney then use lovvFreq, else use 
hiFreq. VVhile generating turbulence values, generate lattice vectors as normal for Perlin Noise, except for 
those lattice points that lie on the right or bottom edges of the active area (the size of the resulting tile). In 
those cases, copy the lattice vector from the opposite edge of the active area. 

If attribute “stitchTiles” is not specifted, then the effect is as if a value of noStitch vvere specifted. 





Animatable: yes. 


type — "fractalNoise / turbulence" 
Imdicates vvhether the filter primitive should perform a noise or turbulence function. If attribute “type” is not 


specifted, then the effect is as if a value of turbulence vvere specifted. 


Animatable: yes. 


Example feTurbulence shovvs the effects of various parameter settings for feTurbulence. 


c?xml versionz"1.0"25 
x İDOCTYPE svg PUBLİC "-///V/3C///DTD SVG 1.1//EN" 
"http: //vvv .v3.org/Graphics/SVG/1.1/DTD/svg11.dtd"s 
€Ssvg vidthe"450px" height-"325px" vievBoxe"0 0 450 325" 
xmlnse"http: / /uvv .v3.0rg/2000/svg" versionze"1.1"5 
etitlesExample feTurbulence - Examples of feTurbulence operationse/titlex 
edescsSix rectangular areas shoving the effects of 
various parameter settings for feTurbulence.-/descx 
€g Tfont-familye"Verdana" text-anchor-"middle" font-sizez"10" 5 
edefsəs 
efilter id-"Turb1" filterUnitse"obiectBoundingBox" 
xze"0sş" ye"Os" vidth-"1005" height-"1008"5 
efeTurbulence typez"turbulence" baseFrequencyz"0.05" numüctavesze"2"/5 
e/filter- 
efilter id-"Turb2" filterUnitse"obiectBoundingBox" 
xze"0sş" ye"Os" vidth-"1005" heighte"1008"5 
efeTurbulence typez"turbulence" baseFrequencyz"0.1" numüctavesz"2"/5 
e/filter- 
efilter ide-"Turb3" filterUnits-"obiectBoundingBox" 
xze"0sş" ye"Os" vidth-"10085" heighte-"1008"5 
efeTurbulence typez"turbulence" baseFrequencyz"0.05" numüctavesze"8"/5 
e/filter- 
efilter id-"Turb4" filterUnitse"obiectBoundingBox" 
xze"0sş" ye"Os" vidth-"1005" heighte"1008"5 
efeTurbulence typez"fractalNoise" baseFrequencyz"0.1" numüctavesz"4"/5 
e/filter- 
efilter ide-"Turb5" filterUnits-e"obiectBoundingBox" 
xe"0sş" ye"Os" vidth-"1005" heighte-"1008"5 
efeTurbulence typez"fractalNoise" baseFrequencyz"0.4" numüctavesz"4"/5 
e/filter- 
efilter id-"Turb6" filterUnitse"obiectBoundingBox" 
xze"0sş" ye"Os" vidth-"1005" heighte-"1008"5 
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efeTurbulence typee"fractalNoise" baseFrequencye"0.1" numüctavese"1"/5 


e/filter- 
s/defs- 


crect xe"1" y-"1" vidth-"448" height-"323" 


crect 
etext 
etext 
etext 


xcrect 
etext 
etext 
etext 


crect 
e€text 
etext 
etext 


crect 
etext 
etext 
etext 


crect 
etext 
etext 
etext 


crect 
etext 
etext 
etext 
x/g” 
c/ svg” 





fi 


x- 





(l-"none" strokez"blue" stroke-vidthe"1" /əs 


"25" y-"25" vidth-"100" height-"75" filter-"url(/Turb1)" 


m"75" ye"117"-type-turbulencec/text- 
m"75" ye"129"5baseFrequencye0 .05-/text- 
m"75" ye"141"5numOctavese2-/text” 


"175" ye"25" vidth-"100" height-"75" filter-"ur1(£Turb2)" 
"225" ye"117"stypezeturbulence-c/text- 

"225" yez"129"5baseFrequencye6.1-/text- 

"225" y-"141"-numOctavesz2-/text” 


"325" ye"25" vidth-"100" height-"75" filter-"ur1(£Turb3)" 
) yz"117"stypezeturbulence-c/text- 
yz"129"xbaseFrequencye0 .05-/text” 

"375" y-"141"-numOctaves-8-/text- 





m"25" ye"180" vidth-"100" height-"75" filter-"ur1(£Turb4)" 
m"75" ye"272"stypezefractalNoisec/text- 

m"75" yze"284"5baseFrequencye0 .1-/text- 

m"75" yz"296"-numOctavesz4-/textə- 


"175" y-"180" vidth-"100" height-"75" filter-"ur1(£Turb5) " 
"225" ye"272":typezfractalNoisec/text- 

"225" yz"284"xbaseFrequencye6 .4-/textəs 

"225" yz"296"-numOctavesz4-/text- 


"325" y-"180" vidth-"100" height-"75" filter-"ur1(£Turb6) " 
"375" y-"272"s:typezfractalNoisec/textx- 

"375" y-z"284":baseFrequencye6.1-/text- 

"375" y-"296"-numOctavesz1-/text” 


Example feTurbulence 


yə 


/ 


/ 


/ 


ys 
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15.25 DOM interfaces 


15.25.1 interface SVGFilterElement 


"The SVGFilterElement interface corresponds to the “filter” element. 


interface SV6FilterElement : SVGElement, 

SVGURTReference, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVöStylable, 
SVGUnitTypes 1 

readonly attribute SVGAnimatedEnumeration filterUnits, 

readonly attribute SVGAnimatedEnumeration primitiveUnits, 

readonly attribute SVGAnimatedLength x, 

readonly attribute SVGAnimatedLength y, 

readonly attribute SVGAnimatedLength vidth, 

readonly attribute SVGAnimatedLength height, 

readonly attribute SVGAnimatedinteger filterResX, 

readonly attribute SVGAnimatedinteger filterResY, 


void setFilterRes(in unsigned long filterResX, in unsigned long filterResY) raises(DÜüMException), 
iR 


Aftributes: 


e filterUnits (readonly SVGAnimatedEnumeration) 


Corresponds to attribute “filterUnits” on the given “filter” element. Takes one of the constants defined in 
SVGünitTypes. 


e primitiveUnits (readonly SVGAnimatedEnumeration) 


Corresponds to attribute “primitiveUnits” on the given “filter” element. Takes one of the constants defined in 
SVGünitTypes. 


e x (readonly SVGAnimatedLength) 


Corresponds to attribute “x” on the given “filter” element. 


ey (readonly SVGAnimatedLength) 


Corresponds to attribute “y” on the given “filter” element. 


e vvidth (readonly SVGAnimatedLength) 


Corresponds to attribute “vvidih” on the given “filter” element. 
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e height (readonly SVGAnimatedLength) 


Corresponds to attribute “height” on the given “filter” element. 


e filterResX (readonly SVGAnimatediInteger) 


Corresponds to attribute “filterRes” on the given “filter” element. Contains the X component of attribute “fil- 


terRes”. 


e filterResY (readonly SVGAnimatedInteger) 


Corresponds to attribute “filterRes” on the given “filter” element. Contains the Y component (possibly com- 
puted automatically) of attribute “filterRes”. 


Operations: 


e void setFilterRes(in unsigned long fi/terResX, in unsigned long filterResY) 


Sets the values for attribute “filterRes”. 
Parameters 


e unsigned long filterResX 
The X component of attribute “filterRes”. 


ə unsigned long fi/terResY 
"The Y component of attribute “filterRes”. 


Exceptions 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


15.25.2 Interface SVGFilterPrimitiveStandardAttributes 


This interface defines the set of DOM attributes that are common across the filter primitive interfaces. 


interface SV6FilterPrimitiveStandardAttributes : SVGStylable ( 
readonly attribute SVGAnimatedLength x, 
readonly attribute SVGAnimatedLength y, 
readonly attribute SVGAnimatedLength vidth, 
readonly attribute SVGAnimatedLength height, 
readonly attribute SVGAnimatedString result, 
Y 
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Aftributes: 


e X (readonly SVGAnimatedLength) 


Corresponds to attribute “x” on the given element. 


y (readonly SVGAnimatedLength) 


Corresponds to attribute “y” on the given element. 


e vvidth (readonly SVGAnimatedLength) 


Corresponds to attribute “vvidih” on the given element. 


e height (readonly SVGAnimatedLength) 


Corresponds to attribute “heighi” on the given element. 


e result (readonly SVGAnimatedString) 


Corresponds to attribute “result” on the given element. 


15.25.3 Interface SVGFEBlendElement 


The SVGFEBlendElement interface corresponds to the “feBlend” element. 


interface SV6FEBlendElement : SVGElement, 
SVGFilterPrimitiveStandardAttributes 1 


// Blend Mode Types 

const unsigned short SVG FEBLEND MÜDE UNKNOMN 69, 
const unsigned short SVG FEBLEND MÜDE NORMAL £ 1, 
const unsigned short SVG FEBLEND MÜDE MÜLTTPLY 2, 


const unsigned short SVG FEBLEND MODE SCREEN z 3, 


const unsigned short SVG FEBLEND MODE DARKEN £ 4, 


const unsigned short SVG FEBLEND MÜDE LIGHTEN - 5, 


readonly attribute SVGAnimatedString inl, 

readonly attribute SVGAnimatedString in2, 

readonly attribute SVGAnimatedEnumeration mode, 
y 


Constants in group “Blend Mode Types”: 


e SVG FEBLEND MODE UNKNOVVN (nsigned short) 


"The type is not one of predefined types. İt is invalid to attempt to define a nevv value of this type or to attempt 
to svvitch an existing value to this type. 


e SVG FEBLEND MODE NORMAL (unsigned short) 


Corresponds to value "normal". 
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SVG FEBLEND MODE MULTİPLY (unsigned short) 


Corresponds to value "multiply". 


e SVG FEBLEND MODE SCREEN (unsigned short) 


Corresponds to value "screen", 


e SVG FEBLEND MODE DARBKLEN (unsigned short) 





Corresponds to value "darken". 


e SVG FEBLEND MODE LIGHTEN (unsigned short) 


Corresponds to value Tighten". 
Attributes: 


e in1 (readonly SVGAnimatedString) 


Corresponds to attribute “in” on the given “feBlend” element. 


e in2 (readonly SVGAnimatedString) 


Corresponds to attribute “in?” on the given “feBlend” element. 


e mode (readonly SVGAnimatedEnumeration) 


Corresponds to attribute “mode” on the given “TeBlend” element. Takes one of the SVG FEBLEND MODE ” 
constants defined on this interface. 


15.25.4 Interface SVGFEColorMatrixElement 


The SVGFEColorMatrixElement interface corresponds to the “feColorMatrix” element. 


interface SV6FEColorMatrixElement : SVGElement, 
SVGFilterPrimitiveStandardAttributes 1 


// Color Matrix Types 

const unsigned short SVG FECOLORMATRIX TYPE UNKNOMN £ 60, 
const unsigned short SVG FECOLORMATRIX TYPE MATRIX 1, 
const unsigned short SVG FECOLORMATRIX TYPE SATURATE £ 2, 
const unsigned short SVG FECOLORMATRIX TYPE HUEROTATE £ 3, 


const unsigned short SVG FECOLORMATRIX TYPE LUMINANCETOALPHA c 4, 


readonly attribute SVGAnimatedString inl, 

readonly attribute SVGAnimatedEnumeration type, 

readonly attribute SVGAnimatedNumberList values, 
R 


c 
.Ə 
5 
İv) 
m") 
(es 
(3) 
E 
E 
ə) 
(9) 
(3 
cc 
. 
- 


Constants in group “Color Matrix Types”: 


e SVG FECOLORMATRIX TYPE UNKNOVVN (nsigned short) 


"The type is not one of predefined types. İt is invalid to attempt to define a nevv value of this type or to attempt 
to svvitch an existing value to this type. 


e SVG FECOLORMATRIX TYPE MATRIX (ınsigned short) 





Corresponds to value "matrix". 


e SVG FECOLORMATRIX TYPE SATURATFE (nsigned short) 


Corresponds to value "saturate". 


e SVG FECOLORMATRIX TYPE HUEROTATE (nsigned short) 


Corresponds to value "hueRotate", 
e SVG FECOLORMATRIX TYPE LUMINANCETOALPHA (unsigned short) 
Corresponds to value TuminanceToAlpha". 
Attributes: 
e in1 (readonly SVGAnimatedString) 


Corresponds to attribute “in” on the given “feColorMatrix” element. 


e type (readonly SVGAnimatedEnumeration) 


Corresponds to attribute “type” on the given “feColorMatrix” element. Takes one of the 
SVG FECOLORMATRIX TYPE “ constants defined on this interface. 


e values (readonly SVGAnimatedNumberlist) 


Corresponds to attribute “values” on the given “feColorMatrix” element. 


15.25.5 Interface SVGFEComponentTransferElement 


The SVGFEComponentTransferElement interface corresponds to the “feComponentTransfer” element. 


interface SV6FEComponentTransferElement : SVGElement, 
SVöFilterPrimitiveStandardAttributes ( 

readonly attribute SVGAnimatedString inl, 

R 
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Aftributes: 


e in1 (readonly SVGAnimatedString) 


Corresponds to attribute “in” on the given “feComponentTransfer” element. 





15.25.6 Interface SVGComponentTransferFunctionElement 


This interface defines a base interface used by the component transfer function interfaces. 


interface SV6ComponentTransferFunctionElement : SVGElement ( 


// Component Transfer Types 
const unsigned short SVG FECOMPONENTTRANSFER TYPE UNKNOMN - 0, 
const unsigned short SVG FECOMPONENTTRANSFER TYPE TDENTTTY z- 1, 
const unsigned short SVG FECOMPONENTTRANSFER TYPE TABLE £ 2, 
const unsigned short SVG FECOMPONENTTRANSFER TYPE DISCRETE 
const unsigned short SVG FECOMPONENTTRANSFER TYPE LTNEAR - 
const unsigned short SVG FECOMPONENTTRANSFER TYPE GAMMA cz 5 


- 3: 
4, 


readonly attribute SVGAnimatedEnumeration type, 
readonly attribute SVGAnimatedNumberList tableValues, 
readonly attribute SVGAnimatedNumber slope, 

readonly attribute SVGAnimatedNumber intercept, 
readonly attribute SVGAnimatedNumber amplitude, 
readonly attribute SVGAnimatedNumber exponent, 
readonly attribute SVGAnimatedNumber offset, 

R 


Constants in group “Component Transfer Types”: 


e SVG FECOMPONENTTRANSFER TYPE UNKNOVVN (unsigned short) 


"The type is not one of predefined types. İt is invalid to attempt to define a nevv value of this type or to attempt 
to svvitch an existing value to this type. 


e SVG FECOMPONENTTRANSFER TYPE IDENTTTY (unsigned short) 


Corresponds to value "identity". 


e SVG FECOMPONENTTRANSFER TYPE TABLE (nsigned short) 


Corresponds to value "table". 


e SVG FECOMPONENTTRANSFER TYPE DISCRETE (unsigned short) 


Corresponds to value "discrete". 


e SVG FECOMPONENTTRANSFER TYPE LINEAR (unsigned short) 
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Corresponds to value Tinear". 


e SVG FECOMPONENTTRANSFER TYPE GAMMA (unsigned short) 


Corresponds to value "gamma". 


Aftributes: 





e İype (readonly SVGAnimatedEnumeration) 


Corresponds to attribute “type” on the given element. Takes one of the 
SVG FECOMPONENTTRANSFER TYPE “ constants defined on this interface. 


e tableValues (readonly SVGAnimatedNumberlist) 


Corresponds to attribute “tableValues” on the given element. 


e slope (readonly SVGAnimatedNumber) 


Corresponds to attribute “slope” on the given element. 


intercept (readonly SVGAnimatedNumber) 


Corresponds to attribute “intercept” on the given element. 


amplitude (readonly SVGAnimatedNumber) 


Corresponds to attribute “amplitude” on the given element. 


exponent (readonly SVGAnimatedNumber) 


Corresponds to attribute “exponent” on the given element. 


e offset (readonly SVGAnimatedNumber) 


Corresponds to attribute “offset” on the given element. 


15.25.7 Interface SVGFEFuncRElement 


The SVGFEFuncRElement interface corresponds to the “feFuncR” element. 


interface SVGFEFuncRElement : SVGComponentTransferFunctionElement 1 
x 
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15.25.8 Interface SVGFEFuncGElement 


The SVGFEFuncRElement interface corresponds to the “feFuncG” element. 


interface SV6FEFuncGElement : SVGComponentTransferFunctionElement (f 





15.25.9 Interface SVGFEFuncBElement 


The SVGFEFuncBElement interface corresponds to the “feFuncB” element. 


interface SVGFEFuncBElement : SVGComponentTransferFunctionElement 1 


15.25.10 Interface SVGFEFuncAElement 


The SVGFEFuncAElement interface corresponds to the “feFuncA” element. 


interface SVGFEFuncAElement : SVGComponentTransferFunctionElement 1 


15.25.11 Interface SVGFECompositeElement 


The SVGFECompositeElement interface corresponds to the “feComposite” element. 


interface SV6FECompositeElement : SVGElement, 
SVGFilterPrimitiveStandardAttributes 1 


// Composite Operators 

const unsigned short SVG FECOMPOSITE OPERATOR UNKNOUN — 0, 
const unsigned short SVG FECOMPOSITE OPERATOR OVER 1, 

const unsigned short SVG FECOMPOSTTE OPERATOR TN c 2, 

const unsigned short SVG FECOMPOSITE OPERATOR OUT z 3, 

const unsigned short SVG FECOMPOSITE OPERATOR ATOP k 4, 

const unsigned short SVG FECOMPOSITE OPERATOR XOR 5, 

const unsigned short SVG FECOMPOSITE OPERATOR ARITHMETTC — 6, 





readonly attribute SVGAnimatedString inl, 
readonly attribute SVGAnimatedString in2, 
readonly attribute SVGAnimatedEnumeration operator, 
readonly attribute SVGAnimatedNumber k1, 
readonly attribute SVGAnimatedNumber k2, 
readonly attribute SVGAnimatedNumber k3, 
readonly attribute SVGAnimatedNumber k4, 
y 


Constants in group “Composite Operators”: 


SVG. FECOMPOSITE OPERATOR UNKNOVVN (nsigned short) 


"The type is not one of predefined types. İt is invalid to attempt to define a nevv value of this type or to attempt 
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to svvitch an existing value to this type. 


SVG. FECOMPOSITE OPERATOR OVER (unsigned short) 


Corresponds to value "over", 


SVG. FECOMPOSITE OPERATOR IN (unsigned short) 


Corresponds to value "in". 





SVG. FECOMPOSITE OPERATOR OUT (tinsigned short) 


Corresponds to value "out". 


SVG. FECOMPOSITE OPERATOR ATOP (unsigned short) 


Corresponds to value "atop". 


SVG FECOMPOSITE OPERATOR XOR (unsigned short) 


Corresponds to value "xor". 


SVG. FECOMPOSITE OPERATOR ARITHMETİC (unsigned short) 


Corresponds to value "arithmetic". 
Attributes: 
e in1 (readonly SVGAnimatedString) 


Corresponds to attribute “in” on the given “feComposite” element. 


e in2 (readonly SVGAnimatedString) 


Corresponds to attribute “in2” on the given “feComposite” element. 


e operator (readonly SVGAnimatedEnumeration) 


Corresponds to attribute “operator” on the given “feComposite” element. Takes one of the 
SVG FECOMPOSITE OPERATOR “ constants defined on this interface. 


c 
.o 
5 
İv) 
m") 
(s 
(3) 
E 
E 
ə) 
(ə) 
o 
ad 
. 
s 


e k1 (readonly SVGAnimatedNumber) 


Corresponds to attribute “k1” on the given “feComposite” element. 


e k2 (readonly SVGAnimatedNumber) 


Corresponds to attribute “k2” on the given “feComposite” element. 





e k3 (readonly SVGAnimatedNumber) 


Corresponds to attribute “k3” on the given “feComposite” element. 


e k4 (readonly SVGAnimatedNumber) 


Corresponds to attribute “k4” on the given “feComposite” element. 


15.25.12 Interface SVGFEConvolveMatrixElement 


The SVGFEConvolveMatrixElement interface corresponds to the “feConvolveMatrix” element. 


interface SV6FEConvolveMatrixElement : SVGElement, 
SVGFilterPrimitiveStandardAttributes ( 


// Edge Mode Values 

const unsigned short SVG EDGEMODE UNKNOMN £ 9, 
const unsigned short SVG EDGEMODE DUPLTCATE - 
const unsigned short SVG EDGEMODE VRAP 2, 
const unsigned short SVG EDGEMODE NONE z 3, 


1, 





readon 


H 


readonly attribute SVGAnimatedString inl, 

readonly attribute SVGAnimatedInteger orderX, 

readonly attribute SVGAnimatedInteger orderY, 

readonly attribute SVGAnimatedNumberList kernelMatrix, 

readonly attribute SVGAnimatedNumber divisor, 

readonly attribute SVGAnimatedNumber bias, 

readonly attribute SVGAnimatedinteger targetX, 

readonly attribute SVGAnimatedinteger targetY, 

readonly attribute SVGAnimatedEnumeration edgeMode, 

readonly attribute SVGAnimatedNumber kernelUnitLengthX, 

readonly attribute SVGAnimatedNumber kernelUnitLengthY, 
y 


attribute SVGAnimatedBoolean preserveAlpha, 


Constants in group “Edge Mode Values”: 


e SVG EDGEMODE UNKNOVVN (nsigned short) 


"The type is not one of predefined types. İt is invalid to attempt to define a nevv value of this type or to attempt 
to svvitch an existing value to this type. 
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e SVG EDGEMODE DUPLICATER (unsigned short) 


Corresponds to value "duplicate", 


e SVG EDGEMODE VVRAP (unsigned short) 





Corresponds to value "vrap". 
e SVG EDGEMODE NONE (insigned short) 
Corresponds to value none", 
Attributes: 


e in1 (readonly SVGAnimatedString) 


Corresponds to attribute “in” on the given “feConvolveMatrix” element. 


e orderX (readonly SVGAnimatediInteger) 


Corresponds to attribute “order” on the given “feConvolveMatrix” element. 


e orderY (readonly SVGAnimatedinteger) 


Corresponds to attribute “order” on the given “feConvolveMatrix” element. 


kernelMatrix (readonly SVGAnimatedNumberlist) 


Corresponds to attribute “kernelMatrix” on the given “feConvolveMatrix” element. 


divisor (readonly SVGAnimatedNumber) 


Corresponds to attribute “divisor” on the given “feConvolveMatrix” element. 


bias (readonly SVGAnimatedNumber) 


Corresponds to attribute "bias” on the given “feConvolveMatrix” element. 


e targetX (readonly SVGAnimatedInteger) 


Corresponds to attribute “targetX” on the given “feConvolveMatrix” element. 
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e targetY (readonly SVGAnimatedinteger) 


Corresponds to attribute “targetY” on the given “feConvolveMatrix” element. 


e edgeMode (readonly SVGAnimatedEnumeration) 


Corresponds to attribute “edgeMode” on the given “feConvolveMatrix” element. Takes one of the 
SVG EDGEMODE “ constants defined on this interface. 





kernelUnitLengthX (readonly SVGAnimatedNumber) 


Corresponds to attribute “kernelUnitLength” on the given “feConvolveMatrix” element. 


kernelUnitLengthY (readonly SVGAnimatedNumber) 


Corresponds to attribute “kernelUnitLength” on the given “feConvolveMatrix” element. 


preserveAlpha (readonly SVGAnimatedBoolean) 


Corresponds to attribute “preserveAlpha” on the given “feConvolveMatrix” element. 


15.25.13 Interface SVGFEDİffuseLightingElement 


"The SVGFEDiffuseLightingElement interface corresponds to the “feDiffuseLighting” element. 


interface SVGFEDiffuseLightingElement : SVGElement, 
SVGFilterPrimitiveStandardAttributes 1 
readonly attribute SVGAnimatedString inl, 
readonly attribute SVGAnimatedNumber surfaceScale, 
readonly attribute SVGAnimatedNumber diffuseConstant, 
readonly attribute SVGAnimatedNumber kernelUnitLengthX, 
readonly attribute SVGAnimatedNumber kernelUnitLengthY, 
ik 


Attributes: 
e in1 (readonly SVGAnimatedString) 


Corresponds to attribute “in” on the given “feDiffuseLighting” element. 


e surfaceScale (readonly SVGAnimatedNumber) 


Corresponds to attribute “surfaceScale” on the given “feDiffuseLighting” element. 


e diffuseConstant (readonly SVGAnimatedNumber) 


Corresponds to attribute “diffuseConstant” on the given “feDiffuseLighting” element. 


e kernelUnitLengthX (readonly SVGAnimatedNumber) 
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Corresponds to attribute “kernelUnitLengith” on the given “feDiffuseLighting” element. 


e kernelUnitLengthY (readonly SVGAnimatedNumber) 


Corresponds to attribute “kernelUnitLengith” on the given “feDiffuseLighting” element. 


15.25.14 Interface SVGFEDistantLightElement 





The SVGFEDistantLightElement interface corresponds to the “feDistaniLight” element. 


interface SVGFEDistantLightElement : SVGElement 4 
readonly attribute SVGAnimatedNumber azimuth, 
readonly attribute SVGAnimatedNumber elevation, 


y 


Aftributes: 


e azimuth (readonly SVGAnimatedNumber) 


Corresponds to attribute “azimuth” on the given “feDistaniLight” element. 


e elevation (readonly SVGAnimatedNumber) 


Corresponds to attribute “elevation” on the given “TeDistaniLight” element. 


15.25.15 Interface SVGFEPointLightElement 


The SVGFEPointLightElement interface corresponds to the “fePointLight” element. 


interface SV6FEPointLightElement : SVGElement ( 
readonly attribute SVGAnimatedNumber x, 
readonly attribute SVGAnimatedNumber y, 
readonly attribute SVGAnimatedNumber z, 
iz 


Aftributes: 


ə X (readonly SVGAnimatedNumber) 


Corresponds to attribute “x” on the given “fePointLight” element. 


e y (readonly SVGAnimatedNumber) 


Corresponds to attribute “y” on the given “fePointLight” element. 
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e Z (readonly SVGAnimatedNumber) 


Corresponds to attribute “z” on the given “fePointLight” element. 


15.25.16 Interface SVGFES potLightElement 


The SVGFESPpotLightElement interface corresponds to the “feSpotLight” element. 


interface SVGFESpotLightElement : SVGElement 1 
readonly attribute SVGAnimatedNumber x, 
readonly attribute SVGAnimatedNumber y, 
readonly attribute SVGAnimatedNumber z, 
readonly attribute SVGAnimatedNumber pointsAtX, 
readonly attribute SVGAnimatedNumber pointsAtY, 
readonly attribute SVGAnimatedNumber pointsAtZ, 
readonly attribute SVGAnimatedNumber specularExponent , 
readonly attribute SVGAnimatedNumber limitingConeAngle, 
y 





Attributes: 
ə X (readonly SVGAnimatedNumber) 


Corresponds to attribute “x” on the given “feSpotLight” element. 


e y (readonly SVGAnimatedNumber) 


Corresponds to attribute “y” on the given “feSpotLight” element. 


e Z (readonly SVGAnimatedNumber) 


Corresponds to attribute “z” on the given “TeSpotLight” element. 


e pointsAtX (readonly SVGAnimatedNumber) 


Corresponds to attribute “pointsAtX” on the given “feSpotLight” element. 


e pointsAtY (readonly SVGAnimatedNumber) 


Corresponds to attribute “pointsAtY” on the given “feSpotLight” element. 


e pointsAtZ (readonly SVGAnimatedNumber) 


Corresponds to attribute “pointsAtZ” on the given “feSpotLight” element. 


e specularExponent (readonly SVGAnimatedNumber) 


Corresponds to attribute “specularExponent” on the given “feSpotLight” element. 
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e limitingConeAngle (readonly SVGAnimatedNumber) 


Corresponds to attribute “limitingConeAngle” on the given “fTeSpotLight” element. 


15.25.17 Interface SVGFEDisplacementMapElement 


The SVGFEDisplacementMapElement interface corresponds to the “feDisplacementMap” element. 


interface SVGFEDisplacementMapElement : SVGElement, 
SV6FilterPrimitiveStandardAttributes 1 





// Channel Selectors 
const unsigned short SVG CHANNEL UNKNOUN — 0, 
const unsigned short SVG CHANNEL R c 1, 

const unsigned short SVG CHANNEL G 
const unsigned short SVG CHANNEL B 
const unsigned short SVG CHANNEL A 


2 
5 
4, 


readonly attribute SVGAnimatedString inl1, 

readonly attribute SVGAnimatedString in2, 

readonly attribute SVGAnimatedNumber scale, 

readonly attribute SVGAnimatedEnumeration xChannelselector, 

readonly attribute SVGAnimatedEnumeration yChannelselector, 
y 


Constants in group “Channel Selectors”: 


e SVG CHANNEL UNKNOVVN (nsigned short) 


"The type is not one of predefined types. İt is invalid to attempt to define a nevv value of this type or to attempt 
to svvitch an existing value to this type. 


e SVG CHANNEL R (unsigned short) 


Corresponds to value "R". 


e SVG CHANNEL G (unsigned short) 


Corresponds to value "G". 


e SVG CHANNEL B (unsigned short) 


Corresponds to value İB". 


e SVG CHANNEL A (unsigned short) 


Corresponds to value "A". 


Aftributes: 
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in1 (readonly SVGAnimatedString) 


Corresponds to attribute “in” on the given “feDisplacementMap” element. 


e in2 (readonly SVGAnimatedString) 


Corresponds to attribute “in2” on the given “feDisplacementMap” element. 





scale (readonly SVGAnimatedNumber) 


Corresponds to attribute “scale” on the given “feDisplacementMap” element. 


xChannelSelector (readonly SVGAnimatedEnumeration) 


Corresponds to attribute “xChannelSelector” on the given “feDisplacementMap” element. Takes one of the 
SVG CHANNEL “ constants defined on this interface. 


yChannelSelector (readonly SVGAnimatedEnumeration) 


Corresponds to attribute “yChannelSelector” on the given “feDisplacementMap” element. Takes one of the 
SVG CHANNEL ” constants defined on this interface. 


15.25.18 Interface SVGFEFloodElement 


The SVGFEFloodElement interface corresponds to the “feFlood” element. 


interface SVG6FEFloodElement : SVGElement, 
SVGFilterPrimitiveStandardAttributes 1 


H 


15.25.19 Interface SVGFEGaussianBlurElement 


The SVGFEGaussianBlurElement interface corresponds to the “feGaussianBlur” element. 


interface SV6FEGaussianBlurElement : SVGElement, 
SVGFilterPrimitiveStandardAttributes ( 


readonly attribute SVGAnimatedString inl, 
readonly attribute SVGAnimatedNumber stdDeviationX, 
readonly attribute SVGAnimatedNumber stdDeviationY, 


void setStdDeviation(in float stdDeviationX, in float stdDeviationY) raises (DOMException) , 


Aftributes: 
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e in1 (readonly SVGAnimatedString) 


Corresponds to attribute “in” on the given “feGaussianBlur” element. 


e stdDeviationX (readonly SVGAnimatedNumber) 


Corresponds to attribute “stdDeviation” on the given “feGaussianBlur” element. Contains the X component of 


attribute “stdDeviation”. 





e stdDeviationY (readonly SVGAnimatedNumber) 


Corresponds to attribute “stdDeviation” on the given “feGaussianBlur” element. Contains the Y component 
(possibly computed automatically) of attribute “stdDeviation”. 


Operations: 


e void setStdDeviationtin float sfeDeviationX, in float stdDeviationY) 


Sets the values for attribute “stdDeviation”. 
Parameters 


e float stdDeviationX 
The X component of attribute “stdDeviation”. 


e float sidDeviationY 
The Y component of attribute “stdDeviation”. 


Exceptions 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


15.25.20 Interface SVGFElmageElement 


The SVGFElmageElement interface corresponds to the “felmage” element. 


interface SV6FElmageElement : SVGElement, 
SVGURTReference, 


SVGLangSpace, 

SVGExternalResourcesRequired, 

SVGFilterPrimitiveStandardAttributes 1 
readonly attribute SVGAnimatedPreserveAspectRatio preserveAspectRatio, 
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Aftributes: 


e preserveAspectRatio (readoniy SVGAnimatedPreserveAspectRatio) 


Corresponds to attribute “preserveAspectRatio” on the given “felmage” element. 


15.25.21 Interface SVGFEMergeElement 





The SVGFEMergeElement interface corresponds to the “feMerge” element. 


interface SV6FEMergeElement : SVGElement, 
SVGFilterPrimitiveStandardAttributes ( 
y 


15.25.22 Interface SVGFEMergeNodeElement 


The SVGFEMergeNodeElement interface corresponds to the “feMergeNode” element. 


interface SVGFEMergeNodeElement : SVGElement 1 
readonly attribute SVGAnimatedString inl, 


Attributes: 


e in1 (readonly SVGAnimatedString) 


Corresponds to attribute “in” on the given “feMergeNode” element. 


15.25.23 Interface SVGFEMorphologyElement 


The SVGFEMorphologyElement interface corresponds to the “feMorphology” element. 


interface SVG6FEMorphologyElement : SVGElement, 
SVGFilterPrimitiveStandardAttributes ( 


// Morphology Operators 
const unsigned short SVG MORPHOLOGY OPERATOR UNKNOMN £ 60, 
const unsigned short SVG MORPHOLOGY OPERATOR ERODE £ 1, 
const unsigned short SVG MORPHOLOGY OPERATOR DITLATE c 2, 





readonly attribute SVGAnimatedString inl, 
readonly attribute SVGAnimatedEnumeration operator, 
readonly attribute SVGAnimatedNumber radiusX, 
readonly attribute SVGAnimatedNumber radiusY, 

y 


Constants in group “Morphology Operators”: 


e SVG MORPHOLOGY, OPERATOR UNKNOVVN (unsigned short) 


"The type is not one of predefined types. İt is invalid to attempt to define a nevv value of this type or to attempt 
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to svvitch an existing value to this type. 


e SVG MORPHOLOGY, OPERATOR ERODE (unsigned short) 


Corresponds to value "erode", 


e SVG MORPHOLOGY, OPERATOR DILATE (nsigned short) 





Corresponds to value "dilate". 
Attributes: 


e in1 (readonly SVGAnimatedString) 


Corresponds to attribute “in” on the given “feMorphology” element. 


e operator (readonly SVGAnimatedEnumeration) 


Corresponds to attribute “operator” on the given “feMorphology” element. Takes one of the 
SVG MORPHOLOOGY OPERATOR “ constants defined on this interface. 


e radiusX (readonly SVGAnimatedNumber) 


Corresponds to attribute “radius” on the given “feMorphology” element. 


e radiusY (readonly SVGAnimatedNumber) 


Corresponds to attribute “radius” on the given “feMorphology” element. 


15.25.24 Interface SVGFEOTffsetElement 


The SVGFEOffsetElement interface corresponds to the “feOffset” element. 


interface SVGFEOTfsetElement : SVGElement, 
SVGFilterPrimitiveStandardAttributes ( 

readonly attribute SVGAnimatedString inl, 

readonly attribute SVGAnimatedNumber dx, 

readonly attribute SVGAnimatedNumber dy, 

R 
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Aftributes: 


e in1 (readonly SVGAnimatedString) 


Corresponds to attribute “in” on the given “feOffset” element. 


e dx (readonly SVGAnimatedNumber) 


Corresponds to attribute “dx” on the given “feOfiset” element. 


e dy (readonly SVGAnimatedNumber) 


Corresponds to attribute “dy” on the given “feOfiset” element. 


15.25.25 Interface SVGFES pecularLightingElement 


The SVGFESPpecularLightingElement interface corresponds to the “feSpecularLighting” element. 


interface SV6FESpecularLightingElement : 


readonly attribute 
readonly attribute 
readonly attribute 
readonly attribute 
readonly attribute 
readonly attribute 


H 


Aftributes: 


SVGAnimatedString 
SVGAnimatedNumber 
SVGAnimatedNumber 
SVGAnimatedNumber 
SVGAnimatedNumber 
SVGAnimatedNumber 


SVGElement, 
SV6FilterPrimitiveStandardAttributes 1 
inl, 

surfaceScale, 

specularConstant, 

specularExponent, 

kernelUnitLengthX, 

kernelUnitLengthY, 


in1 (readonly SVGAnimatedString) 


Corresponds to attribute “in” on the given “feSpecularLighting” element. 


surfaceScale (readonly SVGAnimatedNumber) 


Corresponds to attribute “surfaceScale” on the given “feSpecularLighting” element. 


specularConstant (readonly SVGAnimatedNumber) 


Corresponds to attribute “specularConstant” on the given “feSpecularLighting” element. 


specularExponent (readonly SVGAnimatedNumber) 


Corresponds to attribute “specularExponent” on the given “feSpecularLighting” element. 


e kernelUnitLengthX (readonly SVGAnimatedNumber) 


Corresponds to attribute “kernelUnitLengith” on the given “feSpecularLighting” element. 


e kernelUnitLengthY (readonly SVGAnimatedNumber) 
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Corresponds to attribute “kernelUnitLengith” on the given “feSpecularLighting” element. 


15.25.26 Interface SVGFETileElement 


The SVGFETileElement interface corresponds to the “feTile” element. 


interface SVGFETileElement : SVGElement, 
SVGFilterPrimitiveStandardAttributes ( 

readonly attribute SVGAnimatedString inl1, 

y 





Aftributes: 


e in1 (readonly SVGAnimatedString) 


Corresponds to attribute “in” on the given “TeTile” element. 


15.25.27 Interface SVGFETurbulenceElement 


The SVGFETurbulenceElement interface corresponds to the “feTurbulence” element. 


interface SV6FETurbulenceElement : SVGElement, 
SVGFilterPrimitiveStandardAttributes ( 


// Turbulence Types 

const unsigned short SVG TURBULENCE TYPE UNKNOMN 60, 

const unsigned short SVG TURBULENCE TYPE FRACTALNOTSE £ 1, 

const unsigned short SVG TURBULENCE TYPE TURBULENCE £ 2, 

// Stitch Options 

const unsigned short SVG STITCHTYPE UNKNOUN - 0, 

const unsigned short SVG STITCHTYPE STİTCH — 1, 

const unsigned short SVG STITCHTYPE NOSTTTCH 2, 
readonly attribute SVGAnimatedNumber baseFrequencyX, 
readonly attribute SVGAnimatedNumber baseFrequeneyY? 
readonly attribute SVGAnimatedInteger numüctaves, 
readonly attribute SVGAnimatedNumber seed, 
readonly attribute SVGAnimatedEnumeration stitchTiles, 
readonly attribute SVGAnimatedEnumeration type, 

y 


Constants in group “Turbulence Types”: 


e SVG TURBULENCE TYPE UNKNOVVN (nsigned short) 


"The type is not one of predefined types. İt is invalid to attempt to define a nevv value of this type or to attempt 
to svvitch an existing value to this type. 


e SVG TURBULENCE TYPE FRACTALNOSE (ınsigned short) 


Corresponds to value "TractalNoise", 


e SVG TURBULENCE TYPE TURBULENCE (unsigned short) 
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Corresponds to value "turbulence". 
Constants in group “Stitch Options”: 


e SVG STITCHTYPE UNKNOVVN (nsigned short) 


"The type is not one of predefined types. İt is invalid to attempt to define a nevv value of this type or to attempt 
to svvitch an existing value to this type. 





e SVG STITCHTYPE STTTCH (unsigned short) 


Corresponds to value "stitch". 


e SVG STITCHTYPE NOSTTTCH (unsigned short) 


Corresponds to value mostitch". 
Attributes: 


e baseFrequeneyX (readonly SVGAnimatedNumber) 


Corresponds to attribute “baseFrequency” on the given “feTurbulence” element. Contains the X component of 
the “baseFrequeney” attribute. 


e baseFrequeneyY (readonly SVGAnimatedNumber) 


Corresponds to attribute “baseFrequeney” on the given “feTurbulence” element. Contains the Y component of 
the (possibly computed automatically) “baseFrequency” attribute. 


e numÖOctaves (readonly SVGAnimatedinteger) 


Corresponds to attribute “numOctaves” on the given “feTurbulence” element. 


e seed (readonly SVGAnimatedNumber) 


Corresponds to attribute “seed” on the given “feTurbulence” element. 


e stitchTiles (readonly SVGAnimatedEnumeration) 


Corresponds to attribute “stitehTiles” on the given “feTurbulence” element. Takes one of the 
SVG STITCHTYPE “” constants defined on this interface. 
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e type (readonly SVGAnimatedEnumeration) 


Corresponds to attribute “type” on the given “feTurbulence” element. Takes one of the 
SVG TURBULENCE TYPE “ constants defined on this interface. 





16 İnteractivity 
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16.1 Introduction 

16.2 Complete list of supported events 

16.3 User interface events 

16.4 Pointer events 

16.5 Hit-testing and processing order for user interface events 
16.5.1 Hit-testing 
16.5.2 Event processing 





16.6 The "pointer-evenis” property 
16.7 Magnification and panning 
16.8 Cursors 
16.8.1 Introduction to cursors 
16.8.2 The “cursor” property 
16.8.3 The “cursor” element 
16.9 DOM interfaces 
16.9.1 Interface SVGCursorElement 


16.1 İntroduction 


SVG content can be interactive (i.e., responsive to user-initiated events) by utilizing the follovving features in the 
SVG language: 


e User-initiated actions such as button presses on the pointing device (e.g., a mouse) can cause animations or 
scripts to execufe. 

e "The user can initiate hyperlinks to nevv VVeb pages (see Links out of SVG content: the “a” element) by actions 
such as mouse clicks vvhen the pointing device is positioned over particular graphics elements. 

e In many cases, depending on the value of the “zoomAndPan” attribute on the “svg” element and on the charac- 
teristics of the user agent, users are able to zoom into and pan around SVG content. 

e User movements of the pointing device can cause changes to the cursor that shovvs the current position of the 
pointing device. 


This chapter describes: 
e information about events, including under vvhich circumstances events are triggered 


e hovv to indicate vvhether a given document can be zoomed and panned 
e hovv to specify vvhich cursors to use 


Related information can be found in other chapters: 


e hyperlinks are discussed in Links 

e scripting and event attributes are discussed in Seripting 

e SVG-s relationship to DOM2 events is discussed in Relationship vvith DOM2 event model 
e animation is discussed in Animation 
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16.2 Complete list of supported events 


The follovving aspects of SVG are affected by events: 


ə Using SVG Document Obiect Model (DOM), a script can register DOM 2 event listeners (İDOM2EVENTSİ, 
section 1.3) so that script can be invoked vvhen a given event occurs. 

e SVG includes event attributes on selected elements vvhich define seript that can be executed vvhen a given 
event occurs in association vvith the given element. 

e SVG-s animation elements can be defined to begin or end based on events. 





"The follovving table lists all of the events vvhich are recognized and supported in SVG. "The Evenf name in the 
first column is the name to use vvithin SVG"s animation elements to define the events vvhich can start or end 
animations. The DOMZ2 name in the second column is the name to use vvhen defining DOM 2 event listeners 
(İDOM2EVENTS), section 1.3). The Evenf attribute name in the fourth column contains the corresponding name 
of the event attributes that can be attached to elements in the SVG language. 

Requirements in the table on vvhether an event of a given type bubbles or is cancelable apply only to events 
that are created and dispatched by the user agent. Events of those types created from script using the createEvent 
method on the DocumentEvent interface can be made to bubble or be cancelable vvith the initEvent method. 


Event name and description DOM2 name DOM2 category Event attribute name 





focusin DOMFocusln UlEvent onfocusin 
Occurs vvhen an element receives focus, such as 
vvhen a “text” becomes selected. 


focusout DOMFocusOut UlEvent onfocusout 
Occurs vvhen an element İloses focus, such as vvhen 
a “text” becomes unselected. 


activate DOMActivate UlEvent onactivate 
Occurs vvhen an element is activated, for instance, 

through a mouse click or a keypress. A numerical 

argument is provided to give an indication of the 

type of activation that occurs: 1 for a simple 

activation (e.g. a simple click or Enter), 2 for 


c 
.Ə 
5 
İv) 
m") 
(s 
(3) 
z 
E 
ə) 
(ə) 
o 
ad 
. 
s 





hyperactivation (for instance a double click or Shift 
Enter). 


click 

Occurs vvhen the pointing device button is clicked 
over an element. A click is defined as a mousedovvn 
and mouseup over the same screen location. The 
sequence of these events is: mousedovn, mouseup, 
click. If multiple clicks occur at the same screen 
location, the sequence repeats vvith the detail 
attribute incrementing vvith each repetition. 


mousedovn 
Occurs vvhen the pointing device button is pressed 
over an element. 


mouseup 
Occurs vvhen the pointing device button is released 
over an element. 


mouseover 
Occurs vvhen the pointing device is moved onto an 
element. 


mousemove 
Occurs vvhen the pointing device is moved vvhile it 
İS over an element. 


mouseout 
Occurs vvhen the pointing device is moved avvay 
from an element. 


DOMSubtreeModified 

This is a general event for notification of all changes 
to the document. İt can be used instead of the more 
specific events listed belovv. (The normative 
definition of this event is the description in the 
DOM2 specification.) 


DOMNodelnserted 

Fired vvhen a node has been added as a child of 
another node. (The normative definition of this 
event is the description in the DOM2 specification.) 


(same) 


(same) 


(same) 


(same) 


(same) 


(same) 


(same) 


(same) 


MouseEvent 


MouseEvent 


MouseEvent 


MouseEvent 


MouseEvent 


MouseEvent 


MutationEvent 


MutationEvent 


onclick 


onmousedovvn 


onmouseup 


onmouseover 


onmousemove 


onmouseout 


none 


none 
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DOMNodeRemoved 

Fired vvhen a node is being removed from another 
node. (The normative definition of this event is the 
description in the DOM2 specification.) 


DOMNodeRemovedFromDocument 

Fired vvhen a node is being removed from a 
document, either through direct removal of the 
Node or removal of a subtree in vvhich it is 
contained. (The normative definition of this event is 
the description in the DOM2 specification.) 


DOMNodelnsertedintoDocument 

Fired vvhen a node is being inserted into a 
document, either through direct insertion of the 
Node or insertion of a subtree in vvhich it is 
contained. (The normative definition of this event is 
the description in the DOM2 specification.) 


DOMAttrModified 

Fired after an attribute has been modified on a 
node. (The normative definition of this event is the 
description in the DOM2 specification.) 


DOMCharacterDataModified 

Fired after CharacterData vvithin a node has been 
modified but the node itself has not been inserted or 
deleted. (The normative definition of this event is 
the description in the DOM2 specification.) 


SVGLoad 
The event is triggered at the point at vvhich the user 
agent has fully parsed the element and its 
descendants and is ready to act appropriately upon 
that element, such as being ready to render the 
element to the target device. Referenced extemal 
resources that are required must be loaded, parsed 
and ready to render before the event is triggered. 
Optional extemal resources are not required to be 
ready for the event to be triggered. 

SVGLoad events do not bubble and are not 
cancelable. 


(same) 


(same) 


(same) 


(same) 


(same) 


(same) 


MutationEvent 


MutationEvent 


MutationEvent 


MutationEvent 


MutationEvent 


none 


none 


none 


none 


none 


none 


onload 
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SVGunload (same) none 
Only applicable to outermost svg elements. The 
unload event occurs vvhen the DOM implementation 
removes a document from a vvindovv or frame. 
SVGuünload events do not bubble and are not 
cancelable. 


SVGAbort (same) none 
The abort event occurs vvhen page loading is 
stopped before an element has been allovved to 
load completely. 
SVGAbort events bubble but are not 
cancelable. 


SVGError (same) none 
The error event occurs vvhen an element does not 
load properly or vvhen an error occurs during script 
execution. 
SVGError events bubble but are not 
cancelable. 


SVGResize (same) none 
Occurs vvhen a document vievv is being resized. 
This event is only applicable to outermost svg 
elements and is dispatched after the resize 
operation has taken place. The target of the event 
is the “svg” element. 
SVGResize events bubble but are not 
cancelable. 


SVGscroll (same) none 
Occurs vvhen a document vievv is being shifted 
along the X or Y or both axis, either through a direct 
user interaction or any change on the 
currentTranslate property available on 
SVGSVCElement interface. This event is only 
applicable to outermost svg elements and is 
dispatched after the shift modification has taken 
place. The target of the event is the “svg” element. 

SVGsScroll events bubble but are not 
cancelable. 


SVGZoom none none 


onunload 


onabort 


onerror 


onresize 


onscroll 


onzoom 
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Occurs vvhen the zoom level of a document vievv is 
being changed, either through a direct user 
interaction or any change to the currentScale 
property available on SVGSVGElement interface. 
This event is only applicable to outermost svg 
elements and is dispatched after the zoom level 
modification has taken place. The target of the 
event is the “svg” element. 

SVGZoom events bubble but are not 
cancelable. 


beginEvent none none onbegin 
Occurs vvhen an animation element begins. For 

details, see the description of Interface TimeEvent 

in the SMIL Animation specification. 


endEvent none none onend 
Occurs vvhen an animation element ends. For 

details, see the description of Interface TimeEvent 

in the SMIL Animation specification. 


repeatEvent none none onrepeat 
Occurs vvhen an animation element repeats. İt is 

raised each time the element repeats, after the first 

iteration. For details, see the description of Interface 

TimeEvent in the SMIL Animation specification. 


As in DOM 2 Key events (İDOM2EVENTS), section 1.6.3), the SVG specification does not provide a key event set. 
An event set designed for use vvith keyboard input devices vvill be included in a later version of the DOM and SVG 
specifications. 

Details on the parameters passed to event listeners for the event types from DOM2 can be found in the DOM2 
specification. For other event types, the parameters passed to event listeners are described elsevvhere in this spe- 
cification. 

Event listener attributes can be specifled on some elements to listen to a given event. The script in such at- 
tributes is run only in response to "bubbling" and "at target" phase events dispatched to the element. 

Likevvise, event-value timing specifters used in animation element “begin” and “end” attributes are resolved to 
concrete times only in response to "bubbling" and "at target" phase events dispatched to the relevant element. 


16.3 User interface events 


On user agents vvhich support interactivity, it is common for authors to define SVG documents such that they are 
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responsive to user interface events. Among the set of possible user events are pointer events, keyboard events, and 
document events. 

In response to user interface (UT) events, the author might start an animation, perform a hyperlink to another 
VVeb page, highlight part of the document (e.g., change the color of the graphics elements vvhich are under the 
pointer), initiate a "roll-over" (e.g., cause some previously hidden graphics elements to appear near the pointer) or 
launch a seript vvhich communicates vvith a remote database. 


16.4 Pointer events 


User interface events that occur because of user actions performed on a pointer device are called pointer events. 

Many systems support pointer devices such as a mouse or trackball. On systems vvhich use a mouse, pointer 
events consist of actions such as mouse movements and mouse clicks. On systems vrith a different pointer device, 
the pointing device often emulates the behavior of the mouse by providing a mechanism for equivalent user ac- 
tions, such as a button to press vvhich is equivalent to a mouse click. 

For each pointer event, the SVG user agent determines the fargef element of a given pointer event. The target 
element is the topmost graphics element vvhose relevant graphical content is under the pointer at the time of the 
event. (See property “pointer-evenis” for a description of hovv to determine vvhether an elements relevant graphical 
content is under the pointer, and thus in vvhich circumstances that graphic element can be the target element for 
a pointer event.) VVhen an element is not displayed (i.e., vvhen the “display” property on that element or one of its 
ancestors has a value of none), that element cannot be the target of pointer events. 

If a target element for the pointer event exists, then the event is dispatched to that element according to the 
normal event flovv (İDOM2EVENTSİ, section 1.2). Note, hovvever, that if the target element is in a “use” element 
shadovv tree, that the event flovv vvill include SVGElementinstance obiects. See The “use” element for details. 

If a target element for the pointer event does not exist, then the event is ignored. 


16.5 Hit-testing and processing order for user interface events 


There are tvvo distinct aspects of pointer-device interaction vvith an element or area: 


1. hit-testing, to determine if a pointer event (such as a mouse movement or mouse click) occurred vvithin the 
interaction area of an element, and the subsequent DOM event flovv: 
2. functional processing of actions associated vvith any relevant element. 


16.5.1 Hit-testing 


Determining vvhether a pointer event results in a positive hit-test depends upon the position of the pointer, the 
size and shape of the graphics element, and the computed value of the “pointer-events” property on the element. 
"The definition of the “pointer-events” property belovv describes the exact region that is sensitive to pointer events 
for a given type of graphics element. 

Note that the “svg” element is not a graphics element, and in a Conforming SVG Stand-Alone File a rootmost 


“svg” element vvill never be the target of pointer events, though events can bubble to this element. If a pointer event 
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does not result in a positive hit-test on a graphics element, then it should evoke any user-agent-specific vvindovv 
behavior, such as a presenting a context menu or controls to allovv zooming and panning of an SVG document 
fragment. 

This specification does not define the behavior of pointer events on the rootmost “svg” element for SVG images 
vvhich are embedded by reference or inclusion vvithin another document, e.g., vrhether the rootmost “svg” element 
embedded in an HTML document intercepts mouse click events, future specifications may define this behavior, 
but for the purpose of this specification, the behavior is implementation-specific. 


16.5.2 Event processing 


An element vvhich is the target of a user interface event may have particular interaction behaviors, depending 
upon the type of element and vvhether it has explicit associated interactions, such as scripted event listeners, CSS 
pseudo-classes matches, or declarative animations vvith event-based timing. The algorithm and order for process- 
ing user interface events for a given target element, after dispatching the DOM event, is as follovvs: 


1. If an event handler registered on this element invokes the preventDefau1t () DOM method, then no further 
processing for this element is performed, and the event follovvs the event flovv processing as described in 
DOM Level 2 Events İDOM2EVENTS) (or its successor), 

2. If the element has an associated title or description, such as a “title” element or an “xlink:title” attribute, and 
the user agent supports the display of such information (e.g. via a tooltip or status-bar message), that inform- 
ation should be displayed, as appropriate to the type of pointer event, 

3. If the element matches any relevant dynamic pseudo-class selectors appropriate to the type of pointer event, 
such as :hover, active, or : focus as described in TCSS2), section 5.11, then the relevant class properties 
are applied, 

4. If the element and the event type are associated vvith the activation or cancelation of declarative animation 
though the use of event-value timing specifters, any corresponding instance times must be resolved, and any 
conseqential actions of this instance time resolution (such as immediately starting or stopping the animation) 
must be performed, 

5. If the element is a hyperlink (e.g., it is a descendant element of an “a” element), and the pointer event is of a 
type that activates that hyperlink (e.g. via a mouse click), and if the hyperlink traversal changes the context 
of the content (e.g. opens a different document, or moves the pointer avvay from this element by moving to 
another part of the same document), then no further processing for this element is performed, 

6. If the element is a text content element, and the event type is one vvhich the user agent recognizes as part of 
a text-selection operation (e.g., a mouse click and drag, or a double-click), then the text selection algorithm is 
performed, 

7. If the event type is one vvhich the user agent associates vvith the evocation of special user-interface controls 
(e.g., a right-click or command-cliek evoking a context menu), the user agent should evoke such user-agent- 
specific behavior, such as presenting a context menu or controls to allovv zooming and panning of an SVG 
document fragment. 
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16.6 The “pointer-events” property 


In different circumstances, authors may vvant to control under vvhat conditions particular graphic elements can 
become the target of pointer events. For example, the author might vvant a given element to receive pointer events 
only vvhen the pointer is over the stroked perimeter of a given shape. In other cases, the author might vvant a given 
element to ignore pointer events under all circumstances so that graphical elements underneath the given element 
vvill become the target of pointer events. 

The effects of masking and clipping differ vvith respect to pointer-events. A clip path is a geometric boundary, 
and a given point is clearly either inside or outside that boundary: thus, pointer events must be captured normally 
over the rendered areas of a clipped element, but must not be captured over the clipped areas, as described in the 
definition of clipping paths. By contrast, a mask is not a binary transition, but a pixel operation, and different be- 
havior for fully transparent and almost-but-not-fully-transparent may be confusingly arbitrary: as a consequence, 
for elements vvith a mask applied, pointer-events must still be captured even in areas vvhere the mask goes to zero 
opacity. If an author vvishes to achieve an effect vvhere the transparent parts of a mask allovv pointer-events to pass 
to an element belovv, a combination of masking and clipping may be used. 

The “filter” property has no effect on pointer-events processing, and must in this context be treated as if the 
“filter” vvasn"t specifted. 

For example, suppose a circle vvith a “stroke” of red (i.e., the outline is solid red) and a “fl” of none (i.e., the 
interior is not painted) is rendered directly on top of a rectangle vvith a “fil” of blue. The author might vvant the 
circle to be the target of pointer events only vvhen the pointer is over the perimeter of the circle. V/hen the pointer 
is over the interior of the circle, the author might vvant the underlying rectangle to be the target element of pointer 
events. 

The “pointer-events” property specifies under vvhat circumstances a given graphics element can be the target 


element for a pointer event. It affects the circumstances under vvhich the follovving are processed: 


e user interface events such as mouse clicks 
e dynamic pseudo-classes (i.e., “hover, :active and “focus, PCSS2), section 5.11) 
e hyperlinks (see Links out of SVG content: the “a” element) 


visiblePainted 1 visibleFill 1 visibleStroke 1 visible 1 
Value: 


painted 1 fill / stroke 1 all I none 1 inherit 
lnitial: visiblePainted 
Applies to: graphics elements 


inherited: yes 
Percentages: N/A 
Media: visual 


Animatable: yes 


visiblePainted 
"The given element can be the target element for pointer events vvhen the “visibility” property is set to visible 
and vvhen the pointer is over a "painted" area. The pointer is over a painted area if it is over the interior (i.e., 
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Fİ of the element and the “filP property has an actual value other than none or it is over the perimeter (.e., 
stroke) of the element and the “stroke” property is set to a value other than none. 

visibleFill 
"The given element can be the target element for pointer events vvhen the “visibility” property is set to visible 
and vvhen the pointer is over the interior (i.e., fill) of the element. The value of the “filP property does not 
affect event processing. 

visibleStroke 
"The given element can be the target element for pointer events vvhen the “visibility” property is set to visible 
and vvhen the pointer is over the perimeter (i.e., stroke) of the element. The value of the “stroke” property 
does not affect event processing. 

visible 
The given element can be the target element for pointer events vvhen the “visibility” property is set to visible 
and the pointer is over either the interior (i.e., fill) or the perimeter (i.e., stroke) of the element. The values of 
the “filP and “stroke” do not affect event processing. 

painted 
The given element can be the target element for pointer events vvhen the pointer is over a "painted" area. The 
pointer is over a painted area if it is over the interior (i.e., fill) of the element and the “fil” property has an 
actual value other than none or it is over the perimeter (i.e., stroke) of the element and the “stroke” property 


has an actual value other than none. The value of the “visibility” property does not effect event processing. 


fill 
The given element can be the target element for pointer events vvhen the pointer is over the interior (i.e., fili) 
of the element. The values of the “fili” and “visibility” properties do not affect event processing. 

stroke 
"The given element can be the target element for pointer events vvhen the pointer is over the perimeter (i.e., 
stroke) of the element. The values of the “stroke” and “visibility” properties do not affect event processing. 

all 
"The given element can be the target element for pointer events vvhenever the pointer is over either the in- 
terior (i.e., fill) or the perimeter (i.e., stroke) of the element. The values of the “Til”, “stroke” and “visibility” 
properties do not affect event processing. 

none 


The given element does not receive pointer events. 
For text elemenis, hit-testing is performed on a character cell basis: 


e "Ihe value visiblePainted means that the text string can receive events anyvvhere vvithin the character cell if 
either the “fil) property is set to a value other than none or the “stroke” property is set to a value other than 
none, vvith the additional requirement that the “visibility” property is set to visible. 

e "The values visibleFill, visibleStroke and visible are equivalent and indicate that the text string can receive 
events anyvvhere vvithin the character cell if the “visibility” property is set to visible. The values of the “fil” and 
“stroke” properties do not affect event processing. 

e "The value painted means that the text string can receive events anyvvhere vvithin the character cell if either 
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the “il” property is set to a value other than none or the “stroke” property is set to a value other than none. 
The value of the “visibility” property does not affect event processing. 

e "The values fill, stroke and all are equivalent and indicate that the text string can receive events anyvvhere 
vvithin the character cell, The values of the “ill”, “stroke” and “visibility” properties do not affect event process- 
ing. 

e "The value none indicates that the given text does not receive pointer events. 


For raster images, hit-testing is either performed on a vvhole-image basis (i.e., the rectangular area for the image 
is one of the determinants for vvhether the image receives the event) or on a per-pixel basis (i.e., the alpha values 
for pixels under the pointer help determine vvhether the image receives the event): 


e "Ihe value visiblePainted means that the raster image can receive events anyvvhere vvithin the bounds of the 
image if any pixel from the raster image vvhich is under the pointer is not fully transparent, vvith the addi- 
tional requirement that the “visibility” property is set to visible. 

e "Ihe values visibleFill, visibleStroke and visible are equivalent and indicate that the image can receive events 
anyvvhere vvithin the rectangular area for the image if the “visibility” property is set to visible. 

e "The value painted means that the raster image can receive events anyvvhere vvithin the bounds of the image if 
any pixel from the raster image vvhich is under the pointer is not fully transparent. The value of the “visibility” 
property does not affect event processing. 

e “The values fill, siroke and all are equivalent and indicate that the image can receive events anyvvhere vvithin 
the rectangular area for the image. The value of the “visibility” property does not affect event processing. 

e "The value none indicates that the image does not receive pointer events. 


Note that for raster images, the values of properties “opacity”, “fill-opacity”, “stroke-opacity”, “ill” and “stroke” do not 
affect event processing. 


16.7 Magnification and panning 


Magnification represents a complete, uniform transformation on an SVG document fragment, vvhere the magnify 
operation scales all graphical elements by the same amount. A magnify operation has the effect of a supplemental 
scale and translate transformation placed at the outermost level on the SVG document fragment (i.e., outside the 
outermost svg element). 

Panning represents a translation (i.e., a shift) transformation on an SVG document fragment in response to a 
user interface action. 

SVG user agents that operate in interaction-capable user environments are required to support the ability to 
magnify and pan. 

The outermost svg element in an SVG document fragment has attribute “zoomAndPan?, vvhich takes the pos- 
sible values of disable and magnify, vvith the default being magnif?. 

If disable, the user agent shall disable any magnification and panning controls and not allovv the user to mag- 
nify or pan on the given document fragment. 
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If magnify, in environments that support user interactivity, the user agent shall provide controls to allovv the 
user to perform a "magnify" operation on the document fragment. 

If a “zoomAndPan” attribute is assigned to an inner “svg” element, the “zoomAndPan” setting on the inner “svg” 
element vvill have no effect on the SVG user agent. 

Animatable: no. 


16.8 Cursors 


16.8.1 İntroduction to cursors 


Some interactive display environments provide the ability to modify the appearance of the pointer, vvhich is also 
knovvn as the cursor. Three types of cursors are available: 


e Standard built-in cursors 
e Platform-specific custom cursors 
e Platform-independent custom cursors 


"The “cursor” property is used to specify vvhich cursor to use. The “cursor” property can be used to reference standard 
built-in cursors by specifying a keyvvord such as crosshair or a custom cursor. Custom cursors are referenced via 
a efunciri” and can point to either an external resource such as a platform-specific cursor file or to a “cursor” ele- 
ment, vvhich can be used to define a platform-independent cursor. 


16.8.2 The “cursor” property 
“cursor” 


İT-funciris ,” Tauto 1 crosshair 1 default / pointer 1 move İl e-resize İ ne-resize 1 nvv-resize İ n-resize 1 


Value: : : : : - ş ə 
se-resize 1 svv-resize 1 s-resize 1 vv-resizel text İ vvait l help 111 inherit 

Initial: auto 

Applies to: container elements and graphics elements 

inherited: yes 

Percentages: N/A 

Media: visual, interactive 


Animatable: yes 


"This property speciftes the type of cursor to be displayed for the pointing device. Values have the follovving mean- 


ings: 


auto 
The UA determines the cursor to display based on the current context. 
erosshair 


A simple erosshair (e.g., short line segments resembling a "-" sign). 
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default 
"The platform-dependent default cursor. Often rendered as an arrovv. 
pointer 
"The cursor is a pointer that indicates a link. 
move 
Indicates something is to be moved. 
e-resize, ne-resize, nvv-resize, n-resize, se-TresiZ€, SVV-T€SİZ€, S-TESİZ€, VV-T€SİZ€ 
Indicate that some edge is to be moved. For example, the "se-resize" cursor is used vvhen the movement starts 
from the south-east corner of the box. 
text 
Imndicates text that can be selected. Often rendered as an İI-bar. 
vvait 
Imndicates that the program is busy. Often rendered as a vvatch or hourglass. 
help 
Help is available for the obiect under the cursor. Often rendered as a question mark or a balloon. 
efunciri” 
"The user agent retrieves the cursor from the resource designated by the URL If the user agent cannot handle 
the first cursor of a list of cursors, it shall attempt to handle the second, etc. If the user agent cannot handle 
any user-defined cursor, it must use the generic cursor at the end of the list. 


P 1 cursor : ur1("mything.cur"), ur1("second.svgicurs"), text, ) 


"The “cursor” property for SVG is identical to the “cursor” property defined in CSS2 (İCSS2), section 18.1), vvith the 
additional requirement that SVG user agents must support cursors defined by the SVG “cursor” element. This gives 


a single, cross-platform, interoperable cursor format, vvith PNG as the raster component. 


16.8.3 The “cursor” element 


"The “cursor” element can be used to define a platform-independent custom cursor. A recommended approach for 
defining a platform-independent custom cursor is to create a PNG image İPNGİ and define a “cursor” element that 
references the PNG image and identifies the exact position vvithin the image vvhich is the pointer position (i.e., the 
hot spot). 

The PNG format is recommended because it supporfts the ability to define a transpareney mask via an alpha 
channel, If a different image format is used, this format should support the definition of a transpareney mask (tvvo 
options: provide an explicit alpha channel or use a particular pixel color to indicate transpareney). If the trans- 
pareney mask can be determined, the mask defines the shape of the cursor, othervvise, the cursor is an opaque 
rectangle. Typically, the other pixel information (e.g., the R, G and B channels) defines the colors for those parts of 
the cursor vvhich are not masked out. Note that cursors usually contain at least tvvo colors so that the cursor can 
be visible over most backgrounds. 


ğ , 
cursor 
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Categories: 
None 


Content model: 
Any number of the follovving elements, in any order: 
descriptive elements 


Attributes: 
core attributes 
conditional processing attributes 
xlink attributes 
“externalResourcesRequired” 


... 


x 


.... 


y 
“xlink:href” 


DOM Interfaces: 
SVGCursorElement 


Attribute definitions: 


x — "-coordinates-" 
"The x-coordinate of the position in the cursor /s coordinate system vvhich represents the precise position that 
is being pointed to. 
If the attribute is not specifted, the effect is as if a value of "0" vvere specifted. 
Animatable: yes. 


y — "-coordinates-" 
"The y-coordinate of the position in the cursor/s coordinate system vvhich represents the precise position that 
is being pointed to. 
If the attribute is not specifted, the effect is as if a value of "0" vvere specifted. 


Animatable: yes. 


xlink:href — "-funciri”" 
A Functional IRI reference to the file or element vvhich provides the image of the cursor. 
Animatable: yes. 


SVG user agents are required to support PNG format images as targets of the “xlink:href” attribute. 


16.9 DOM interfaces 


16.9.1 Interface SVGCursorElement 
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The SVGCursorElement interface corresponds to the “cursor” element. 


interface SV6CursorElement : SVGElement, 
SVGURTReference, 
SVGTests, 
SVGExternalResourcesRequired if 
readonly attribute SVGAnimatedLength x, 
readonly attribute SVGAnimatedLength y, 


Attributes: 





e X (readonly SVGAnimatedLength) 


Corresponds to attribute “x” on the given “cursor” element. 


ey (readonly SVGAnimatedLength) 


Corresponds to attribute “y” on the given “cursor” element. 
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17.1 References 


17.1.1 Overvievv 
On the Internet, resources are identifled using IRIs (Internationalized Resource lIdentifters). For example, an SVG 
file called someDravving.svg İocated at http://example.com might have the follovving IRİ: 


http://example. com/someD raving.svg 


An TRI can also address a particular element vvithin an XML document by including an IRI fragment identifter 
as part of the IR An IRİ vvhich includes an IRI fragment identifter consists of an optional base IRI, follovved by 
a "B" character, follovved by the İRI fragment identifter. For example, the follovving IRI can be used to specify the 
element vvhose ID is "Lamppost" vvithin file someDravving.svg: 


http://example. com/ someDrav/ing .svgzLamppost 


17.1:2 IRIs and URİIs 


mternationalized Resource Identifters (1RIs) are a more generalized complement to Uniform Resource Identifters 
(URIs). An IRİ is a sequence of characters from the Universal Character Set TUNICODE). A URİI is constructed 
from a much more restricted set of characters. All URIs are already conformant IRİs. A mapping from IRis to 
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URis is defined by the İRI specification, vvhich means that TRIs can be used instead of URIs in XML documenits, to 
identify resources. IRİs can be converted to URİs for resolution on a netvvork, if the protocol does not support IRIs 
directly. 

Previous versions of SVG, follovving XLink, defined an İRI reference type as a URİ or as a sequence of char- 
acters vvhich must result in an İRİ after a particular escaping procedure vvas applied. "The escaping procedure vvas 
repeated in the XLink 1:0 specification İXLINKİ, and in the V/3C XML Sehema Part 2: Datatypes specification 
İSCHEMA2). This copying introduced the possibility of error and divergence, but vvas done because the IRI spe- 
cification vvas not yet standardized. 

Im this specification, the correct term IRI is used for this "URI or sequence of characters plus an algorithm" 
and the escaping method, vvhich turns IRis into URis, is defined by reference to the TRI specification ERFC3987İ, 
vvhich has since become an IETF Proposed Standard. Other VV3C specifications are expected to be revised over 
time to remove these duplicate descriptions of the escaping procedure and to refer to IRI directly. 


17.1.3 Syntactic forms: IRI and FunciIRI 


IRIs are used in the “xlink:href” attribute. Some attributes allovv both IRIs and text strings as content. To disam- 
biguate a text string from a relative IRİ, the functional notation -FunclRİ” is used. This is simply an IRI delimited 
vvith a functional notation. Note: For historical reasons, the delimiters are "urİ(" and ")", for compatibility vvith the 
CSS specifications. The FunclRİ form is used in presentation attributes . 

SVG makes extensive use of TRI references, both absolute and relative, to other obiects. For example, to filla 
rectangle vvith a linear gradient, you first define a “TinearGradient” element and give it an ID, as in: 


elinearGradient xml:id-"MyGradient"-...c/linearGradient” 


You then reference the linear gradient as the value of the “fil” property for the rectangle, as in the follovving ex- 
ample: 


crect fille"ur1(£MyGradient)"/” 
SVG supports tvvo types of TRİ references: 


e local İRİ references, vvhere the IRI reference does not contain an -absolutelRT5 or -relativelRI5 and thus only 
contains a fragment identifter (1.e., F-elemenilD”- or Fxpointer(id-elemenilD”)) 
e non-local IRİ references, vvhere the IRI reference does contain an -absolutelRT- or -relativelRI- 


17.1.4 Processing of IRI references 
The follovving rules apply to the processing of TRİ references: 


e IRİ references to nodes that do not exist shall be treated as invalid references. 

ə IRİ references to elements vvhich are inappropriate targets for the given reference shall be treated as invalid 
references (see list belovv for appropriate targets). For example, the “clip-path” property can only refer to 
“clipPath” elements. The property setting clip-path:url(FMyElement) is an invalid reference if the referenced 


element is not a “clipPath”. 


e IRİ references that directly or indirectly reference themselves are treated as invalid circular references. 


"The follovving list deseribes the elements and properties that allovv IRI references and the valid target types for 
those references: 
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e the “a” element can reference any İlocal or non-local resource 

e the “altGiyph” element must reference either an “altGiyphDef” element or a “glyph” element 

e the “animate” element (see Identifying the target element for an animation for reference rules) 

e the “animateColor” element (see Identifying the target element for an animation for reference rules) 

e the “animateMotion” element (see Identifying the target element for an animation for reference rules) 

e the “animateTransform” element (see 1dentifying the target element for an animation for reference rules) 


e the “clip-path” property must reference a “clipPath” element 





e the “color-profile” element must reference an ICC profile resource 

e the “color-profile” property must reference an ICC profile resource or a “color-profile” element 

e the "src" descriptor on an (color-profile definition must reference an ICC profile resource or a “color-profile” 
element 

e the “cursor” element must reference a resource that can provide an image for the cursor graphic 

e the “cursor” property must reference a resource that can provide an image for the cursor graphic 

e the “felmage” element must reference any İocal or non-local resource 

e the “fil” property (see Specifying paint for reference rules) 

e the “filter” element must reference a “filter” element 

e the “filter” property must reference a “filter” element 

e the “image” element must reference any İocal or non-local resource 

e the “linearGradient” element must reference a “linearGradient” or “radialGradient” element 

e the “marker”, “marker-start”, “marker-mid” and “marker-end” properties must reference a “marker” element. 

e the “mask” property must reference a “mask” element 

e the “pattern” element must reference a “pattern” element 

e the “radialGradient” element must reference a “linearGradient” or “radialGradient” element 

e the “script” element must reference an external resource that provides the script content 

e the “stroke” property (see Specifying paint for reference rules) 

e the “textPath” element must reference a “path” element 

e the “tref” element can reference any SVG element 

e the “set” element (see Identifying the target element for an animation for reference rules) 

e the “use” element can reference any local or non-local resource 


"The follovving rules apply to the processing of invalid TRI references: 


e An invalid local IRI reference (i.e., an invalid references to a node vvithin the current document) represents 
an error (see Error processing), apart from the “xlink:href” attribute on the “a” element and the properties that 
allovv for backup values in the case vvhere the TRİ reference is invalid (see “fili” and “stroke”?). 

e An invalid circular IRI reference represents an error (see Error processing). 

ə VVhen attribute “externalResourcesRequired” has been set to "true" on the referencing element or one of its an- 
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cestors, then an unresolved external IRI reference (i.e., a resource that cannot be located) represents an error 
(see Error processing). 


17.1.5 IRI reference attributes 


IRI references are normally specified vvith an “href” attribute in the XLink FXLinkl namespace. For example, if 
the prefix of "xlink" is used for attributes in the XLink namespace, then the attribute is be specifted as “xlink-href”. 
"The value of this attribute forms a reference for the desired resource (or secondary resource, if there is a fragment 
identifter). 

The value of the “href” attribute must be an Internationalized Resource Identifter. 

If the protocol, such as HTTP, does not support İRis direetly, the TRI is converted to a URI by the SVG imple- 
mentation, as described in section 3.1 of the IRI specification PRFC3987. 

Because it is impractical for any application to check that a value is an IRİ reference, this specification follovvs 
the lead of the TRI Specification in this matter and imposes no such conformance testing requirement on SVG ap- 
plications. 

If the IRI reference is relative, its absolute version must be computed by the method deseribed in XML Base 
before use EXML-BASE1. 


xlink:type -— "simple" 
Identiftes the type of XLink being used. In SVG 1.1, only simple links are available. Links are simple links 
by default, so the attribute xlink:type-"simple" is optional and may be omitted on simple links. Refer to the 
XML Linking Language (XLink) İXLINKI. 
Animatable: no. 


xlink: role - "-IRI-" 
An optional TRİ reference that identifies some resource that describes the intended property. The value must 
be an IRI reference as defined in İRFC3987), except that if the IRI scheme used is allovved to have absolute 
and relative forms, the IRI portion must be absolute. VVhen no value is supplied, no particular role value shall 
be inferred. Refer to the XML Linking Language (XLink) İXLINKİ. 
Animatable: no. 


xlink:arcrole — "-IRI-" 
An optional TRİ reference that identifies some resource that describes the intended property. The value must 
be an IRI reference as defined in TRFC3987), except that if the IRI scheme used is allovved to have absolute 
and relative forms, the IRI portion must be absolute. VVhen no value is supplied, no particular role value 
shall be inferred. The arcrole attribute corresponds to the İRDF-PRIMER) notion of a property, vvhere the 
role can be interpreted as stating that "starting-resource HAS arc-role ending-resource" This contextual role 
can differ from the meaning of an ending resource vvhen taken outside the context of this particular arc. For 
example, a resource might generically represent a "person, but in the context of a particular arc it might 
have the role of "mother" and in the context of a different arc it might have the role of "daughter." Refer to 
the XML Linking Language (XLink) İXLINKI. 
Animatable: no. 
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xlink:title - "-anything”" 
The title attribute shall be used to describe the meaning of a link or resource in a human-readable fashion, 
along the same lines as the role or arcrole attribute. A value is optional: if a value is supplied, it shall contain 
a string that describes the resource. In general it is preferable to use a “title” child element rather than a “title” 
attribute. The use of this information is highly dependent on the type of processing being done. It may be 
used, for example, to make titles available to applications used by visually impaired users, or to create a table 
of links, or to present help text that appears vvhen a user lets a mouse pointer hover over a starting resource. 
Refer to the XML Linking Language (XLink) TXLINKİ. 
Animatable: no. 


xlink:shov £ "nevv" İ "replace" / "embed" İ "other" İ "none" 
"This attribute is provided for backvvards compatibility vvith SVG 1.1. İt provides documentation to XLink- 
avvare processors. İn case of a conflict, the target attribute has priority, since it can express a vvider range of 
values. Refer to the XML Linking Language (XLink) İXLINKI. 
Animatable: no. 


xlink:actuate - "onLoad" 
"his attribute is provided for backvvards compatibility vvith SVG 1.1. İt provides documentation to XLink- 
avvare processors. Refer to the XML Linking Language (XLink) İXLINKI. 
Animatable: no. 


In all cases, for compliance vvith either the "Namespaces in XML 1.0" or the "Namespaces in XML 1.1" Recom- 
mendation İXML-NS10İTXML-NSİ, an explicit XLink namespace declaration must be provided vvhenever one of 
the above XLink attributes is used vvithin SVG content. One simple vvay to provide such an XLink namespace 
declaration is to include an “xmlİns” attribute for the XLink namespace on the “svg” element for content that uses 


XLink attributes. For example: 


s€svg xmlns:xlinke"http: / /vuyv/..V3.org/1999/x1ink" ...s 
cimage xlink:href-"foo.png" .../s 
s/ svg” 


17.2 Links out of SVC content: the “a” element 


SVG provides an “a” element, to indicate links (also knovvn as hyperlinks or Vveb links). The “a” element may contain 
any element that its parent may contain, except itself. 

SVG uses XLink (İEXLinkl) for all link definitions. SVG 1.1 only requires that user agents support XLink"s no- 
tion of simple links. Each simple link associates exactly tvvo resources, one local and one remote, vvith an arc going 
from the former to the latter. 

A simple link is defined for each separate rendered element contained vvithin the “a” element: thus, if the “a” 
element contains three “circle” elements, a link is created for each circle. For each rendered element vvithin an “a” 
element, the given rendered element is the local resource (the source anchor for the link). 

The remote resource (the destination for the link) is defined by a İRI specifted by the XLink “xlink:href” attrib- 
ute on the “a” element. The remote resource may be any VVeb resource (e.g., an image, a video clip, a sound bite, 


a program, another SVG document, an HTML document, an element vvithin the current document, an element 


vvithin a different document, etc.). By activating these links (by clicking vvith the mouse, through keyboard input, 
voice commands, etc.), users may visit these resources. 
Example link01 assigns a link to an ellipse. 


c?xml versionz"1.0" standalone-"no"?z 
x DOCTYPE svg PUBLİC "-//V3C//DTD SVG 1.1//EN" 
"http: / /vvv/.vV3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
€svg vidthe"5cm" height-"3cm" vievBoxze"0 0 5 3" versione"1.1" 
xmlnse"http://uvv.v3.org/2000/svg" xmlns:xlinke"http: / /vuv/..vV3.0T9/1999/xlink"əs 
edescsExample link01 - a link on an ellipse 
s/desc- 
crect xe".01" ye-".01" vidth-"4.98" height-"2.98" 
fill-"none" strokez"blue" stroke-vidthe" .03"/5 
ca xlink:href-"http://uvv.v3.org"s 
cellipse cxe"2.5" cyze"1.5" rxe"2" rye"l" 
fill-"red" /” 
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c/ax 
x/ svg” 


Example link01 














If the above SVG file is vievved by a user agent that supports both SVG and HTML, then clicking on the ellipse vvill 
cause the current vvindovv or frame to be replaced by the VV3C home page. 


Categories: a 
Container element 


Content model: 

Any number of the follovving elements, in any order: 
animation elements 
descriptive elements 
shape elements 
structural elements 
gradient elements 
. 

“altGiyphDef” 
“clipPath” 
“color-profile” 
“cursor” 
“filter” 

“font” 


“font-face” 


“foreignObiect” 
“image” 
“marker” 


“mask” 
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“pattern” 
“script” 
“style” 
“svvitch” 
dexi 
“vievv” 
Attributes: 
conditional processing attributes 





core attributes 

graphical event attributes 
presentation attributes 
xlink attributes 

“class” 

“style” 
“externalResourcesRequired” 
“transform” 

“xlink:href” 

“xlink:shovv” 
“xlink:actuate” 


“target” 


DOM Interfaces: 
SVGAElement 


Attribute definitions: 


xlink:shov — "nevv 


" 1 "replace" 
"This attribute provides documentation to XLink-avvare processors. If target-" blank" then use 
xlink:shovv-"nevv" else use Teplace", İn case of a conflict, the target attribute has priority, since it can express 
a vvider range of values. Refer to the XML Linking Language (XLink) İXLINKI. 


Animatable: no. 


xlink:actuate — "onRequest" 
"This attribute provides documentation to XLink-avvare processors that an application should traverse from 
the starting resource to the ending resource only on a post-loading event triggered for the purpose of tra- 
versal. Refer to the XML Linking Language (XLink) TXLINKI. 
Animatable: no. 
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xlink:href — "-IRI-" 
"The location of the referenced obiect, expressed as an İRİ reference. 
Animatable: yes. 


target - " replace" İ " self" İ " parent" İ " top" İ " blank" /1 "-XML-Names" 
"his attribute should be used vvhen there are multiple possible targets for the ending resource, such as vvhen 
the parent document is a multi-frame HTML or XHTML document. This attribute speciftes the name or por- 
tion of the target vvindovv, frame, pane, tab, or other relevant presentation context (e.g., an HTML or XHTML 
frame, iframe, or ob/ect element) into vvhich a document is to be opened vvhen the link is activated: 


“replace - The current SVG image is replaced by the linked content in the same rectangular area in the same 


frame as the current SVG image. 


-self - The current SVG image is replaced by the linked content in the same frame as the current SVG image. 
If the attribute is not specifted, " self" is assumed. 


-parent - The immediate frameset parent of the SVG image is replaced by the linked content. 
“top : The content of the full vvindovv or tab, including any framses, is replaced by the linked content 


-blank - A nevv un-named vvindovv or tab is requested for the display of the linked content. If this fails, the 
result is the same as top 


“£XML-Names : Speciftes the name of the frame, pane, or other relevant presentation context for display of 
the linked content. If this already exists, it is re-used, replacing the existing content. If it does not exist, it is 


created (the same as " blank", except that it novv has a name). 


Note: The value " nevv" is nof a legal value for target (use " blank"). 
Animatable: yes. 


17.3 Linking into SVC content: IRI fragments and SVC vievvs 


17.3.1 Introduction: IRİ fragments and SVCG vievvs 
Because SVG content often represents a picture or dravving of something, a common need is to link into a par- 


ticular vievv of the document, vvhere a vievr indicates the initial transformations so as to present a closeup of a 
particular section of the document. 


17.3.2 SVC fragment identifiers 


To link into a particular vievv of an SVG document, the IRI fragment identifter needs to be a correctly formed SVG 


fragment identifier. An SVG fragment identifter defines the meaning of the "selector" or "Fragment identifter" 
portion of IRIs that locate resources of MIME media type "image/svgexml". 
An SVG fragment identifier can come in tvvo forms: 
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e Shorthand bare name form of addressing (e.g., MyDravving.svg/MyVievv). This form of addressing, vvhich al- 
lovvs addressing an SVG element by its ID, is compatible vvith the fragment addressing mechanism for older 
versions of HTML. 

e SVG vievr specification (e.g., MyDravving.svg/svgVievv(vievvBox(0,200,1000,1000))). This form of addressing 
speciftes the desired vievv of the document (e.g., the region of the document to vievv, the initial zoom level) 
completely vvithin the SVG fragment specification. The contents of the SVG vievv specification are the five 
parameter specifications, vievvBox(...), preserveAspectRatio(...), transform(...), zoomAndPan(...) and vievvTar- 
get(...), vrhose parameters have the same meaning as the corresponding attributes on a “vievr” element, or, in 
the case of transform(...), the same meaning as the corresponding attribute has on a “g” element). 





An SVG fragment identifter is defined as follovvs: 


SVöFragmentldentifier ::- BareName İl 
SVGVievSpec 

BareName ::z XML Name 
SVGVievSpec ::z "svgViev(" SVGVievAttributes ")" 
SVöVievAttributes ::z SVGVievAttribute 1 

SVGVievAttribute "," SVGVievAttributes 
SVöVievAttribute ::z vievBoxSpec İ 

preserveAspectRatioSpec 1 

transformSpec 1 

zoomAndPanSpec 1 

vievTargetSpec 
vieuvBoxSpec ::z "VievBox(" VievBoxParams ")" 
preserveAspectRatioSpec “ "preserveAspectRatio(" AspectParams ")" 
transformSpec ::z "transform(" TransformParams ")" 
zoomAndPanSpec ::z "zoomAndPan( " ZoomAndPanParams ")" 
vievTargetSpec ::z "vievTarget(" VievTargetParams ")" 

vvhere: 


e VievvBoxParams corresponds to the parameter values for the “vievvBox” attribute on the “vievv” element. For 
example, vievvBox(0,0,200,200). 

e AspectParams corresponds to the parameter values for the “preserveAspectRatio” attribute on the “vievv” ele- 
ment. For example, preserveAspectRatio(xMidYMid). 

e TransformParams corresponds to the parameter values for the “transform” attribute that is available on many 
elements. For example, transform(scale(5)). 

ə ZoomAndPanParams corresponds to the parameter values for the “zoomAndPan” attribute on the “vievr” ele- 
ment. For example, zoomAndPan(magnify). 

e Viev/TargetParams corresponds to the parameter values for the “vievvTarget” attribute on the “viev” element. 


For example, viev/Target(MyElementlID). 
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Spaces are not allovved in fragment specifications: thus, commas are used to separate numeric values vvithin an 
SVG vievv specification (e.g., £svgVievv(vievvBox(0,0,200,200))) and semicolons are used to separate attributes (e.g., 
3svgVievv(viev/ Box(0,0,200,200):preserveAspectRatio(none))). 

Semiceolons used to separate "SVGVievvAttribute" in SVG fragments may be url-escaped (as 7:3B): this is useful 
vvhen animating a (semi-colon separated) list of IRIs because othervvise the semicolon vvould be interpreted as a 
list separator. 

The five types of SVGVievvAttribute may occur in any order, but each type may only occur at most one time 
in a correctly formed SVGVievvSpec. 

VVhen a source document performs a link into an SVG document, for example via an HTML anchor element 
(İHTMLAl, section 12.2, i.e., ca href-...- element in HTML) or an XLink specification İXLINKİ, then the SVG frag- 
ment identifter speciftes the initial vievv into the SVG document, as follovvs: 


e If no SVG fragment identifter is provided (e.g, the specified IRI did not contain a "EZ" character, such as 
MyDravving.svg), then the initial vievv into the SVG document is established using the vievv specification at- 
tributes (i.e., “vievvBox”, etc.) on the outermost svg element. 

ə If the SVG fragment identifer addresses a “vievv” element vvithin an SVG document (e.g., MyDravv- 
ing.svgöMyVievv or MyDravving.svgixpointer(id(“MyVievv"))) then the closest ancestor “svg” element is dis- 
played in the vievrport. Any vievv specification attributes included on the given “vievv” element override the 
corresponding vievv specification attributes on the closest ancestor “svg” element. 

ə If the SVG fragment identifler haddresses specific SVG viev (e.g., MyDravv- 
ing.svgisvgVievv(vievvBox(0,200,1000,1000))), then the document fragment defined by the closest ancestor “svg” 
element is displayed in the vievvport using the SVG vievv specification provided by the SVG fragment identi- 
fler. 

e If the SVG fragment identifter addresses any element other than a “vievv” element, then the document defined 
by the closest ancestor “svg” element is displayed in the vievvport using the vievv specification attributes on 
that “svg” element. 


17.3.3 Predefined vievvs: the “vievv” element 


"The “vievv” element is defined as follovvs: 


Categories: “vievv” 
None 


Content model: 
Any number of the follovving elements, in any order: 
descriptive elements 


Attributes: 
core attributes 
“externalResourcesRequired” 


“vievvBox” 


“preserveAspectRatio” 
“zoomAndPan” 


“viev/Target” 
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DOM Tnterfaces: 
SVGVievvElement 


Attribute definitions: 


vievTarget - "XML Name IXML NAMEİY"" 
Imdicates the target obyect associated vvith the vievv. 
Animatable: no. 





17.3.4 Highlighting vievvs 


Tt is helpful to users if the target element(s) are highlighted. The visual styling of this highlight should be decided 
by the document author, because the SVG User Agent has no vvay to determine vvhat changes vvould make the 
elements more visible. 

"The CSS :target selector (İSELECTORSİ), section 6.2.2) may be used in a stylesheet to provide alternate styling 
for elements vvhich are the target of links. For example: 


estyle typeze"text/css"xs 
aTfoo:target (filter: ur1(3g1ov)) 
/” vhen the element vith id foo is linked to, use a glov filter “/ 


.bar :target (stroke: green, fill-opacity: 0.5) 
/” vhen any descendants of elements vith class bar are linked 
to, make the fill partly transparent and use a green stroke “/ 


:target (stroke: red ) 
/” Tor everything else, fİust use a red stroke “/ 
ce/styles 


17.4 DOM interfaces 


17.4.1 Interface SVGAElement 


The SVGAElement interface corresponds to the “a” element. 


interface SVGAElement : SVGElement, 
SVGURTReference, 
SVGTests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVösStylable, 
SVGTransformable £ 

readonly attribute SVGAnimatedString target, 


Aftributes: 


e target (readonly SVGAnimatedString) 


Corresponds to attribute “target” on the given “a” element. 
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17.4.2 Interface SVGVievvElement 


The SVGVievvElement interface corresponds to the “vievv” element. 


interface SV6GVieuElement : SVGElement, 
SVGExternalResourcesRequired, 
SVGFitToVievBox, 
SVGZoomAndPan 1 
readonly attribute SVGStringList vievTarget, 





Aftributes: 


e vievv Target (readonly SVGSiringlist) 


Corresponds to attribute “viev/Target” on the given “vievv” element. A list of DOMString values vvhich contain 
the names listed in the “vievvTarget” attribute. Each of the DOMString values can be associated vvith the cor- 
responding element using the getElementByld() method call. 


18 Scripting 
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18.1 Specifying the scripting language 


18.1.1 Specifying the default scripting language 


"The “contentSeriptType” attribute on the “svg” element speciftes the default seripting language for the given docu- 


ment fragment. 


contentScriptType — "content-type" 
Identiftes the default seripting language for the given SVG document fragment. This attribute sets the default 
seripting language used to process the value strings in event attributes. This language must be used for all 
instances of script that do not specify their ovvn scripting language. The value content-type specifies a media 
type, per MIME Part Tvvo: Media Types TRFC20461. The default value is "application/ecmaseript" İRFC43291. 
Animatable: no. 


18.1.2 Local declaration of a scripting language 


Tt is also possible to specify the secripting language for each individual “seript” element by specifying a “type” on the 
“script” element. 
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18.2 The “script element 


A “seript” element is equivalent to the “seript” element in HTML and thus is the place for scripts (e.g., ECMASeript). 
Any functions defined vvithin any “seript” element have a "global" seope across the entire current document. 

Example seript01 defines a function circle click vvhich is called by the “onclick” event attribute on the 
“circle” element. The dravving belovv on the left is the initial image. The dravving belovv on the right shovvs the res- 
ult after clicking on the circle. 

Note that this example demonstrates the use of the “onclick” event attribute for explanatory purposes. The 
example presupposes the presence of an input device vvith the same behavioral characteristics as a mouse, vvhich 
vvill not alvvays be the case. To support the vvidest range of users, the “onactivate” event attribute should be used 
instead of the “onclick” event attribute. 

Before attempting to execute the “seript” element the resolved media type value for “type” must be inspected. 
If the SVG user agent does not suppott the seripting language then the “seript” element must not be executed. 


c?xml versionz"1.0" standalone-"no"?z 
€ DOCTYPE svg PUBLİC "-//03C//DTD SVG 1.1//EN" 
"http: / /uuv .v/3..org/Graphics/SVG/1.1/DTD/svg11.dtd"x 
s€svg vidth-"6cm" height-"5cm" vievBoxz"0 0 600 500" 
xmlnsze"http: / /vuv/ .vV3.0T9/2000/svg" versionz"1.1"2 
cdescsExample script01 - invoke an ECMAScript function from an onclick event 
xe/desc- 
c1-- ECMAScript to change the radius vith each click --s 
c€script typeze"application/ecmascript"s -I ICDATAT 
function circle click(evt) ( 
var circle € evt.target, 
var currentRadius — circle.getAttribute("r"), 
if (currentRadius —- 100) 
circle.setAttribute("r", currentRadius”2), 
else 
circle.setAttribute("r", currentRadius”0.5), 
ı 


11 -c/script- 


c1-- QOutline the draving area vith a blue line --x 
crect xe"1" y-"1" vidth-"598" height-"498" fill-"none" strokez"blue"/x 


c1-- Act on each click event --s 
ecircle onclicke"circle click(evt)" cxz"300" cyz"225" r-"100" 
fill-"red"/s 


etext xe"300" y-"480" 
font-family-"Verdana" font-sizez"35" text-anchor-"middle"s 


Click on circle to change its size 
v/texte 
x/ svg” 


Example script01 
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Click on circle to change its size Click on circle to change its size 





Categories: “script” 
None 


Content model: 
Any elements or character data. 


Attributes: 
core attributes 
xlink attributes 
“externalResourcesRequired” 
“type” 
“xlink:href” 

DOM Tnterfaces: 
SVGöeriptElement 


Attribute definitions: 


type - "content-type" 
Identiftes the seripting language for the given “seript” element. The value confenf-type specifies a media type, 
per Multipurpose Internet Mail Extensions (MIME) Part Tvvo İRFC2046). If a “type” is not provided, the value 
Of “contentSeriptType” on the “svg” element shall be used, vvhich in turn defaults to "application/ecmascript" 
İRFC4329İ. İf a “seript” element falls outside of the outermost svg element and the “type” is not provided, the 
“type” must default to "application/ecmaseript" İRFC43291. 


Animatable: no. 


xlink:href - "-iri-" 
An TRI reference to an external resource containing the script code. 
Animatable: no. 
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18.3 Event handling 


Events can cause scripts to execute vvhen either of the follovving has occurred: 


e Event attributes such as “onclick” or “onload” are assigned to particular elements, vvhere the values of the event 
attributes are script vvhich is executed vvhen the given event occurs. 

e Event listeners as described in DOM Level 2 Events İDOM2EVENTSİ are defined vvhich are invoked vvhen a 
given event happens on a given obfect. 


Related sections of the spec: 


e User interface events describes hovv an SVG user agent handles events such as pointer movements events 
(e.g.. mouse movement) and activation events (e.g., mouse click). 

e Relationship vvith DOM2 events describes vvhat parts of DOM are supported by SVG and hovv to register 
event listeners. 


18.4 Event attributes 


"The follovving event attributes are available on many SVG elements. 
The complete list of events that are part of the SVG language and SVG DOM and deseriptions of those events 
is provided in Complete list of supported events. 


18.4.1 Event attribute for the SVGLoad event 


Belovv is the definition for the “onload” event attribute. It can be specifted on all of the animation elements and 
most of the graphics elements and container elements. The “onload” event attribute is classifled as both a graphical 
event attribute and an animation event attribute. (See the definition for each element to determine vvhether it can 
have a graphical event attribute specifted on it.) 


Attribute definitions: 


onload z "-anything”" 
Specifles some script to execute vvhen "bubbling" or "at target" phase listeners for the SVGLoad event are 
fired on the element the attribute is specifted on. 
Animatable: no. 


18.4.2 Event attributes on graphics and container elements 


Belovv are the definitions for the graphical event attributes. These can be specified on most graphics elements and 
container elements. (See the definition for each element to determine vvhether it can have a graphical event attrib- 
ute specifted on it.) 
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Note that “onload”, defined above, is also classifted as a graphical event attribute. 
Attribute definitions: 


onfocusin £ "-anything”" 
onfocusout £ "-anything”" 
onactivate — "-anything”" 
onclick — "-anything”" 
onmousedovn £ "-anything”" 
onmouseup £ "-anything”" 


onmouseover £ "-anything”" 

onmousemove £ "-anything”" 

onmouseout £ "-anything”" 
Specifies some script to execute vvhen "bubbling" or "at target" phase listeners for the corresponding event 
are fired on the element the attribute is specified on. See the Complete list of support events to determine 
vvhich event each of these event attributes corresponds to. 


Animatable: no. 


18.4.3 Document-level event attributes 


Belovv are the definitions for the document event attributes. These can be specifted only on “svg” elements. 
Attribute definitions: 


onunload £ "-anything”" 
onabort £ "xanything-" 
onerror £ "xanything”" 


onresize — "-anything”" 

onscro11 £ "-anything”" 

onzoom £ "-anything”" 
Specifies some script to execute vvhen "bubbling" or "at target" phase listeners for the corresponding event 
are fired on the element the attribute is specified on. See the Complete list of support events to determine 
vvhich event each of these event attributes corresponds to. 


Animatable: no. 


18.4.4 Animation event attributes 


Belovv are the definitions for the animation event attributes. These can be specifted on the animation elements. 
Note that “onload”, defined above, is also classified as an animation event attribute. 
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Attribute definitions: 


onbegin - "-anything”" 

onend — "-anything”" 

onrepeat £ "-anything”" 
Specifles some script to execute vvhen "bubbling" or "at target" phase listeners for the corresponding event 
are fired on the element the attribute is specified on. See the Complete list of support events to determine 
vvhich event each of these event attributes corresponds to. 
Animatable: no. 


18.5 DOM interfaces 


18.5.1 Interface SVGScriptElement 


The SVGSeriptElement interface corresponds to the “seript” element. 


interface SV6ScriptElement : SVGElement, 
SVGURTReference, 
SVGExternalResourcesRequired ( 
attribute DOMString type setraises(DOMException) , 
y 


Attributes: 


e type (DOMsString) 


Corresponds to attribute “type” on the given “script” element. 
Exceptions on setting 


e DOMEvxception, code NO MODIFICATION ALLOVVED ERR 
Raised on an attempt to change the value of a read only attribute. 


18.5.2 Interface SVGZoomEvent 


A DOM consumer can use the hasFeature of the DOMlmplementation interface to determine vvhether the SVG 
zoom event set has been implemented by a DOM implementation. The feature string for this event set is 
"SVGZoomEvents". This string is also used vvith the createEvent method. 
The zoom event handler occurs before the zoom event is processed. The remainder of the DOM represents 
the previous state of the document. The document vvill be updated upon normal return from the event handler. 
The UT event type for a zoom event is: 


SVGZoom 
The zoom event occurs vvhen the user initiates an action vvhich causes the current vievv of the SVG document 
fragment to be rescaled. Event handlers are only recognized on “svg” elements. See SVGZoom event. 
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e Bubbles: Yes 

e Cancelable: No 

e Context Info: zoomRectScreen, previousScale, previousTranslate, nevvScale, nevvTranslate, screenX, 
screenY, clientX, clientY, altKey, ctrİKey, shiftKey, metaKey, relatedNode. 
(screenX, screenY, clientX and clientY indicate the center of the zoom area, vvith clientX and clientY in 
vievvport coordinates for the corresponding “svg” element. relatedNode is the corresponding “svg” ele- 


ment.) 


interface SV6ZoomEvent : UTEvent 1 
readonly attribute SV6GRect zoomRectScreen, 
readonly attribute float previousScale, 
readonly attribute SVGPoint previousTranslate, 
readonly attribute float nevScale, 
readonly attribute SVGPoint nevTranslate, 

R 





Aftributes: 


e zoomRectScreen (readonly SVGRect) 


"The specified zoom rectangle in screen units. 
The SVGRect obiect is read only. 


e previousScale (readonly float) 


"The scale factor from previous zoom operations that vvas in place before the zoom operation occurred. 


previousTranslate (readonly SVGPoint) 


The translation values from previous zoom operations that vvere in place before the zoom operation occurred. 
The SVGPoeint obfeet is read only. 


e nevvScale (readonly float) 


"The scale factor that vvill be in place after the zoom operation has been processed. 


e nevvTranslate (readonly SVGPoint) 


"The translation values that vvill be in place after the zoom operation has been processed. 
The SVGPoint obfeet is read only. 


19 Animation 
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19.1 Introduction 
19.2 Animation elements 
19.2.1 Overvievv 
19.2.2 Relationship to SMIL Animation 
19.2.3 Animation elements example 
19.2.4 Attributes to identify the target element for an animation 
19.2.5 Attributes to identify the target attribute or property for an animation 





19.2.6 Animation vvith namespaces 

19.2.7 Paced animation and complex types 

19.2.8 Attributes to control the timing of the animation 

19.2.8.1 Clock values 

19.2.9 Attributes that define animation values over time 

19.2.10 Attributes that control vvhether animations are additive 

19.2.11 Inheritance 

19.2.12 The “animate” element 

19.2.13 The “set” element 

19.2.14 The “animateMotion” element 

19.2.15 The “animateColor” element 

19.2.16 The “animateTransform” element 

19.2.17 Elements, attributes and properties that can be animated 
19.3 Animation using the SVG DOM 
19.4 DOM interfaces 

19.4.1 Interface ElementTimeControl 

19.4.2 Interface TimeEvent 

19.4.3 Interface SVGAnimationElement 

19.4.4 Interface SVGAnimateElement 

19.4.5 Interface SVGSetElement 

19.4.6 Interface SVGAnimateMotionElement 

19.4.7 Interface SVGMPathElement 

19.4.8 Interface SVGAnimateColorElement 

19.4.9 Interface SVGAnimateTransformElement 


19.1 İntroduction 


Because the VVeb is a dynamic medium, SVG supporits the ability to change vector graphics over time. SVG content 
can be animated in the follovving vvays: 
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e Using SVGs animation elements. SVG document fragments can describe time-based modifications to the doc- 
uments elements. Using the various animation elements, you can define motion paths, fade-in or fade-out 
effects, and obfects that grovv, shrink, spin or change color. 

e Using the SVG DOM. "he SVG DOM conferms to key aspects of the Document Obiect Model (DOM) Level 1 
EDOM1İ and Document Obiect Model (DOM) Level 2 İDOM2) specifications. Every attribute and style sheet 
setting is accessible to scripting, and SVG offers a set of additional DOM interfaces to support efficient anima- 
tion via scripting. As a result, virtually any kind of animation can be achieved. The timer facilities in seripting 
languages such as ECMASeript can be used to start up and control the animations İŞECMA-z262l. (See example 
belovv.) 

ə SVG has been designed to allovv SMIL İSMİL) to use animated or static SVG content as media components. 


19.2 Animation elements 


19.2.1 Overvievv 


SVG-s animation elements vvere developed in collaboration vvith the V/3C Synchronized Multimedia (SYMM) 
VVorking Group, developers of the Synehronized Multimedia Integration Language (SMIL) 3.0 Specification 
İSMILI. 

The SYMM VVorking Group, in collaboration vvith the SVG VVorking Group, has authored the SMIL Anima- 
tion specification İSMILANIM), vrhich represents a general-purpose XML animation feature set. SVG incorporates 
the animation features defined in the SMIL Animation specification and provides some SVG-specific extensions. 

For an introduction to the approach and features available in any language that supports SMIL Animation, 
see SMIL Animation overvievv and SMIL Animation animation model ((SMILANIM), sections 2 and 3). For the 
list of animation features vvhich go beyond SMIL Animation, see SVG extensions to SMIL Animation. 


19.2.2 Relationship to SMIL Animation 


SVG is a host language in terms of SMIL Animation and therefore introduces additional constraints and features 
as permitted by that specification. Except for any SVG-specific rules explicitly mentioned in this specification, 
the normative definition for SVG"s animation elements and attributes is the SMIL Animation specification 
İSMILANIMI. 

SVG supports the follovving four animation elements vvhich are defined in the SMIL Animation specification: 


“animate” allovvs scalar attributes and properties to be assigned different values over time 


“set” a convenient shorthand for “animate”, vvhich is useful for assigning animation values to 
non-numeric attributes and properties, such as the “visibility” property 


“animateMotion” moves an element along a motion path 


“animateColor” modifies the color value of particular attributes or properties over time 
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Although SVG defines “animateColor?, its use is deprecated in favor of simply using the “animate” element to target 
properties that can take color values. 
Additionally, SVG includes the follovving compatible extensions to SMIL Animation: 


“animateTransform” modifies one of SVGrs transformation attributes over time, such as the “transform” 
attribute 


“path” attribute SVG allovvs any feature from SVG"s path data syntax to be specified in a “path” 
attribute to the “animateMotion” element (SMIL Animation only allovvs a subset of 
SVG:s path data syntax vvithin a “path” attribute) 


“mpath” element SVG allovvs an “animateMotion” element to contain a child “mpath” element vvhich 
references an SVC “path” element as the definition of the motion path 


“keyPoints” SVG adds a “keyPoints” attribute to the “animateMotion” to provide precise control of 
attribute the velocity of motion path animations 
“rotate” attribute SVG adds a “rotate” attribute to the “animateMotion” to control vvhether an obiect is 


automatically rotated so that its x-axis points in the same direction (or opposite 
direction) as the directional tangent vector of the motion path 


For compatibility vvith other aspects of the language, SVG uses İRİ references via an “xlink:href” attribute to identi- 
fy the elements vvhich are to be targets of the animations, as allovved in SMIL 3.0. 

SMIL Animation requires that the host language define the meaning for document begin and the document 
end. Since an “svg” is sometimes the root of the XML document tree and other times can be a component of a 
parent XML grammar, the document begin for a given SVG document fragment is defined to be the exact time 
at vvhich the “svg” elements SVGLoad event is triggered. The document end of an SVG document fragment is the 
point at vvhich the document fragment has been released and is no longer being processed by the user agent. 
Hovvever, nested “svg” elements vvithin an SVG document do not constitute document fragments in this sense, and 
do not define a separate document begin: all times vvithin the nested SVG fragment are relative to the document 
time defined for the root “svg” element. 

For SVG, the term presentation time indicates the position in the timeline relative to the document begin of 
a given document fragment. 

SVG defines more constrained error processing than is defined in the SMIL Animation specification 
(SMIİLANIMI. SMİL Animation defines error processing behavior vvhere the document continues to run in certain 
error situations, vvhereas all animations vvithin an SVG document fragment vvill stop in the event of any error 
vvithin the document (see Error processing). 


19.2.3 Animation elements example 


Example anim01 belovv demonstrates each of SVG"s five animation elements. 


c€?xml versione"1.0" standalonez"no"?x 


x DOCTYPE svg PUBLİC "-//03C//DTD SVG 1.1//EN" 
"http: /vvv/ .v3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
€svg vidth-"8cm" height-"3cm" vievBoxz"0 0 800 300" 
xmlnsze"http://vuv.v3.org/2000/svg" versionze"1.1"5 
edescsExample anim01 - demonstrate animation elements-/desc” 
xrect xe"1" yz"1" vidth-"798" height-"298" 
fill-"none" strokeze"blue" stroke-vidthz"2" /s 
c1-- The folloving illustrates the use of the "animate" element 
to animate a rectangles x, y, and vidth attributes so that 
the rectangle grovs to ultimately fill the vievport. --” 
crect id-"RectElement" x-"300" y-"100" vidth-"300" height-"100" 
fill-"rgb(255,255,0)" s 
xanimate attributeName-"x" attributeTypez"XML" 
beginz"0s" durz"9s" fill-"freeze" from-"300" toz"0" /s 
xanimate attributeName-"y" attributeTypeze"XML" 
beginz"Os" durz"9s" fill-"freeze" from-"100" toz"0" /s 
canimate attributeName-"vidth" attributeTypez"XML" 
beginz"0s" durz"9s" fill-"freeze" from-"300" toz"800" /5 
cxanimate attributeName-"height" attributeType-"XML" 
beginz"Os" durz"9s" fill-"freeze" from-"100" toz"300" /5 
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c/ rects 
c1-- Set up a nev user coordinate system so that 
the text string"s origin is at (0,0), alloving 
rotation and scale relative to the nev origin --s 
€g transform-"translate(100, 100)" 5 
c1-- The folloving illustrates the use of the "set", "animateMotion" , 
"animate" and "animateTransform" elements. The "text" element 
belov starts off hidden (i.e., invisible). At 3 seconds, it: 
5 becomes visible 
5 continuously moves diagonally across the vieuport 
” changes color from blue to dark red 
“ rotates from -30 to zero degrees 
 scales by a factor of three, --” 
etext ide-"TextElement" xz"0" yz"8" 
font-family-"Verdana" font-sizez"35.27" visibilitye-"hidden" x” 
It"s alivel 
cset attributeNamez-"visibility" attributeTypez"CSS" toz"visible" 
begin-"3s" durz"6s" fill-"freeze" / 
canimateMotion path-"M 0 0 L 100 100" 
beginz"3s" durz"6s" fill-"freeze" / 
xanimate attributeNamee"fill" attributeTypeze"CSS" 
Trom-"rgb(0,0,255)" toz"rgb(128,0,0)" 
beginz"3s" durz"6s" fill-"freeze" /s 
cxanimateTransform attributeName-"transform" attributeType-z"XML" 
typez"rotate" fTrom-"-30" toz"0" 
beginz"3s" durz"6s" fill-"freeze" / 
canimateTransform attributeName-"transform" attributeTypez"XML" 
typeze"scale" frome"1" toz"3" additivez"sum" 
beginz"3s" durz"6s" fill-"freeze" / 
c/text- 
x/gz 
c/ svg” 


Example anim01 








— 
as” 
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At zero seconds At three seconds 
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At six seconds At nine seconds 


"The sections belovv describe the various animation attributes and elements. 


19.2.4 Attributes to identify the target element for an animation 
"The follovving attribute is common to all animation elements and identiftes the target element for the animation. 
Attribute definitions: 


xlink:href - "-iri-" 

An IRI reference to the element vvhich is the target of this animation and vvhich therefore vvill be modifled 
over time. 

The target element must be part of the current SVG document fragment. 

ciri” must point to exactly one target element vvhich is capable of being the target of the given anima- 
tion. İf -iri- points to multiple target elements, if the given target element is not capable of being a target of 
the given animation, or if the given target element is not part of the current SVG document fragment, then 
the document is in error (see Error processing). 

Ifthe “xlink-href” attribute is not provided, then the target element vvill be the immediate parent element 
of the current animation element. 

Refer to the descriptions of the individual animation elements for any restrictions on vvhat types of ele- 
ments can be targets of particular types of animations. 

Except for any SVG-specific rules explicitly mentioned in this specification, the normative definition for 
this attribute is the SMIL Animation specification. In particular, see SMIL Animation: Specifying the anima- 
tion target (İSMILANIM), section 3.1). 
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19.2.5 Attributes to identify the target attribute or property for an animation 


"The follovving attributes are the animation attribute target attributes, vvhich identify the target attribute or prop- 
erty for the given target element vvhose value changes over time. 


Attribute definitions: 


attributeName - "-attributeNames”" 
Speciftes the name of the target attribute. An XMLNS prefix may be used to indicate the XML namespace 
for the attribute. The prefix vvill be interpreted in the scope of the current (i.e., the referencing) animation 
element. 
Except for any SVG-specific rules explicitly mentioned in this specification, the normative definition for 
this attribute is the SMIL Animation specification. In particular, see SMIL Animation: Specifying the anima- 
tion target ((SMILANIM), section 3.1). 


attributeType — "CSS I XML İ auto" 
Speciftes the namespace in vvhich the target attribute and its associated values are defined. The attribute 
value is one of the follovving (values are case-sensitive): 


CSS 
This specifies that the value of “attributeName” is the name of a CSS property defined as animatable in 
this specification. 


XML 
"This speciftes that the value of “attributeName” is the name of an XML attribute defined in the default 
XML nameşpace for the target element. If the value for “attributeName” has an XMLNS prefix, the im- 
plementation must use the associated namespace as defined in the scope of the target element. The 
attribute must be defined as animatable in this specification. 


auto 
The implementation should match the “attributeName” to an attribute for the target element. The im- 
plementation must first search through the list of CSS properties for a matching property name, and if 
none is found, search the default XML namespace for the element. 


"The default value is "auto". 
Except for any SVG-specific rules explicitly mentioned in this specification, the normative definition for 


this attribute is the SMIL Animation specification. In particular, see SMIL Animation: Specifying the anima- 
tion target ((SMILANIM), section 3.1). 


19.2.6 Animation vvith namespaces 


Example animns01 belovv shovvs a namespace prefix being resolved to a namespace name in the scope of the ref- 
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erencing element, and that namespace name being used (regardless of the prefix vvhich happens to be used in the 
target scope) to identify the attribute being animated. 


c?xml versione"1.0" encoding-"UTF-8"75 
€SVg versionz"1.1" xmlnsze"http: / /vMM/.v/3.0T9/2000/svg" 
xmlns:xlinke"http:/ /vvv/.v/3.org/1999/x1ink"s 
etitlesDemonstration of the resolution of namespaces for animationc/titlex 
€1-- at the point of definition, the QName a:href resolves to the namespace 
name "http://vv/.v/3.org/1999/xlink" and the 1ocal name "href" --s 
sg xmlns:az"http://vuv.v3.org/1999/xlink"s 
canimate attributeName-"a:href" xlink:href-"i/foo" dur-"2s" toz"tuo.png" fill-"fTreeze"/s 
x/g” 
€1-- at the point of use, the namespace name "http://uvv.v3.org/1999/xlink" 
happens to be bound to the namespace prefix "b" vhile the prefix 
"xlink" is bound to a different namespace name --x 
€g xmlns:be"http://uuv.v3.org/1999/xlink" xmlns:xlinke"http://example.net/bar"x 
cimage xml:id-"foo" b:href-"one.png" xz"35" y-"50" vidth-"410" height-"160"/5 
x/g” 
c/ svg” 


19.2.7 Paced animation and complex types 


Paced animations assume a notion of distance betvveen the various animation values defined by the “to”, “from”, 
“by” and “values” attributes. Distance is defined only for scalar types (such as -length”), colors and the subset of 
transformation types that are supported by “animateTransform”. In the list of distance functions belovv, Va and Vb 
represent the tvvo values the distance betvveen vvhich is being calculated. 

Since paced animation is intended to produce an animation vvith an even pace of change, it does not make 
sense to define distance functions for all data types. Distance can be usefully defined for types vvhose values are n- 
dimensional vectors (including scalars, vvhich are 1-dimensional vectors). For example, a -length” value is a scalar 
value, and a -color” value is a 3-dimensional vector. Thus attributes of these types can have paced animation ap- 
plied to them. On the other hand, a -list-of-length” (as used by “stroke-dasharray”) is a list of scalars (1-dimensional 
vectors), and -list-of-pointss (as used by the “poinis” attribute on a “polygon”) is a list of 2-dimensional vectors. 
"Therefore, these types do not have a distance function defined and cannot have paced animation applied to them. 

The distance functions for types that support paced animation are as follovvs: 


ecoordinate”, cinteger”, -length” and -number- 
distance(Va, Vb) - İVa - Vbl 
Examples: animating the “x” attribute on a “rect”, or the “stroke-vvidth” property on a “circle”. 
ecolor” 
distance(Va, Vb) - sqrt((Va.red - Vb.red)” “a (Va.green - Vb.green)” 4 (Va.blue - Vp.blue)?, vvhere: 
Vired is the red component of the V: color value, 
Vi.green is the green component of the V: color value, and 
Vi.blue is the blue component of the V) color value. 
Each of the color component values is usually in the range 10, 11, vvhere 0 represents none of that 
color component, and 1 represents the maximum amount of that color component, in the sRGB gamut 
İSRGBİ. Since -color” values may specify colors outside of the sRGB gamut, these component values 
may İle outside the range 10, 11. 
Example: animating the “fil” property on an “ellipse”. 
Transform definitions of type "translate" 
distance(Va, Vb) - sqrt((Va.tx - Vb.tx)” (Va-ty - Vb.ty)?), vvhere: 


Vitx is the x component of the V? translation transform value, and 
Vity is the y component of the V? translation transform value. 
Example (for all transform definition types): animating the “transform” attribute on a “g” using “anim- 


ateTransform.. 
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Transform definitions of type "scale" 
distance(Va, Vb) - sqrt((Va.sx - Vb.sx)” 4 (Va.sy - Vb.sy)?), vvhere: 
Vi.sx is the x component of the V? scale transform value, and 
Vi:.sy is the y component of the V? scale transform value. 
Note that, as vrhen specifying scale transformations in a -transform-list, if the y component of the 
scale is omitted it is implicitly equal to the x component. 
Transform definitions of type Totate", "skevvX" and "skevvY" 
distance(Va, Vb) - sqrt((Va.angle - Vb.angle)?), vvhere: 
V:.angle is the angle component of the V: rotation or skevv transform value. 
Since the distance function for rotations is not in terms of the rotation center point components, a paced 
animation that changes the rotation center point may not appear to have a paced movement vvhen the 





animation is applied. 


Distance functions for all other data types are not defined. If caleMode-"paced" is used on an animation of an at- 
tribute or property vvhose type is not one of those listed above, the animation effect is undefined. SVG user agents 
may choose to perform the animation as if caleMode-"linear", but this is not required. Authors are recommended 


not to specify paced animation on types not listed above. 


19.2.8 Attributes to control the timing of the animation 


"The follovving attributes are the animation timing attributes. They are common to all animation elements and 
control the timing of the animation, including vvhat causes the animation to start and end, vvhether the animation 
runs repeatediy, and vvhether to retain the end state the animation once the animation ends. 

In the syntax specifications that follovv, optional vvhite space is indicated as "S", defined as follovvs: 


S o::z (/x20 1 £x9 İ £XD İ £/xA)” 
Attribute definitions: 


begin - "begin-value-list" 
Defines vvhen the element should begin (i.e. become active). 
"The attribute value is a semicolon separated list of values. 


begin-value-list ::- begin-value (S? ":" S? begin-value-list )? 
A semicolon separated list of begin values. The interpretation of a list of begin times is detailed in SMIL 
Animation "s section on "Evaluation of begin and end time lists". 
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begin-value ::- ( offset-value İ syncbase-value İl event-value İ repeat-value İ accessKey-value 1 
vvallelock-sync-value ) "indefinite" ) 
Describes the element begin. 


offset-value ::z ( S? "-" / "-" S? )? ( Clock-value ) 
For SMIL Animation, this describes the element begin as an offset from an implicit syncbase. For SVG, 
the implicit syncbase begin is defined to be relative to the document begin. Negative begin times are 
entirely valid and easy to compute, as long as there is a resolved document begin time. 


syncbase-value ::— ( Id-value "." ( "begin" I "end" ) ) ( S? ("--"İ"-") S? Clock-value )? 
Describes a syncbase and an optional offset from that syncbase. The element begin is defined relative 
to the begin or active end of another animation. A syncbase consists of an ID reference to another 
animation element follovved by either begin or end to identify vvhether to synchronize vvith the begin- 
ning or active end of the referenced animation element. 


event-value ::— ( Id-value "." )? ( event-ref ) ( S? ("--"I"-") S? Clock-value )? 

Describes an event and an optional offset that determine the element begin. The animation begin is 
defined relative to the time that the event is raised. The list of event-symbols available for a given 
event-base element is the list of event attributes available for the given element as defined by the SVG 
DTD, vvith the one difference that the leading "on" is removed from the event name (i.e., the animation 
event name is "click, not "onclick”. A list of all events supported by SVG can be found in Complete list 
of supported events. Details of event-based timing are described in SMIL Animation: Unifying Event- 
based and Scheduled Timing. 


repeat-value ::— ( Id-value "." )? "repeat(" integer ")" ( S? ("-"İ"-") S? Clock-value )? 
Describes a qualified repeat event. The element begin is defined relative to the time that the repeat 
event is raised vvith the specifted iteration value. 


accessKey-value ::- "accessKey(" character ")" ( S? ("--"İ"-") S? Clock-value )? 
Describes an accessKey that determines the element begin. The element begin is defined relative to the 
time that the accessKey character is input by the user. 


vvallclock-sync-value ::- "vrallelock(" vvallelock-value ")" 
Describes the element begin as a real-vvorld clock time. The vvallelock time syntax is based upon syntax 
defined in Representation of dates and times 1158086011. 


"indefinite" 
The begin of the animation vvill be determined by a "beginElement()" method call or a hyperlink tar- 
geted to the element. 
"The animation DOM methods are described in DOM interfaces. 
Hyperlink-based timing is deseribed in SMIL Animation: Hyperlinks and timing. 


Except for any SVG-specific rules explicitly mentioned in this specification, the normative definition for 
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this attribute is the SMIL Animation specification. In particular, see SMIL Animation: "egin" attribute 
(İSMILANIM), section 3.2.1). 


dur £ Clock-value 1 "media" İ "indefinite" 
Specifies the simple duration. 
"The attribute value can be one of the follovving: 


Clock-value 
Specifies the length of the simple duration in presentation time. Value must be greater than 0. 


"media" 
Speciftes the simple duration as the intrinsic media duration. This is only valid for elements that define 
media. 
(For SVG-s animation elements, if "media" is specifted, the attribute vvill be ignored.) 


"indefinite" 
Specifles the simple duration as indefinite. 


If the animation does not have a “dur” attribute, the simple duration is indefinite. Note that interpolation vvill 
not vvork if the simple duration is indefinite (although this may still be useful for “set” elements). Except for 
any SVG-specific rules explicitly mentioned in this specification, the normative definition for this attribute is 
the SMIL Animation specification. In particular, see SMIL Animation: "dur" attribute (İSMILANIM), section 
3.2.1). 


end  "end-value-list" 
Defines an end value for the animation that can constrain the active duration. The attribute value is a semi- 
colon separated list of values. 


end-value-list ::- end-value (S? "," S? end-value-list )? 
A semicolon separated list of end values. The interpretation of a list of end times is detailed belovv. 


end-value :: ( offset-value İl syncbase-value İ event-value İl repeat-value İ accessKey-value 1 vvallclock- 
sync-value l "indefinite" ) 
Deseribes the active end of the animation. 


A value of "indefinite" speciftes that the end of the animation vvill be determined by an endElement method 
call (the animation DOM methods are described in DOM interfaces). 

Except for any SVG-specific rules explicitly mentioned in this specification, the normative definition 
for this attribute is the SMIL Animation specification. In particular, see SMIL Animation: "end" attribute 
(İSMILANIM)), section 3.3.2). 


min — Clock-value 1 "media" 
Specifies the minimum value of the active duration. 
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The attribute value can be either of the follovving: 


Clock-value 
Specifies the length of the minimum value of the active duration, measured in local time. 
Value must be greater than 0. 


"media" 
Specifies the minimum value of the active duration as the intrinsic media duration. This is only valid 
for elements that define media. (For SVG"s animation elemenis, if "media" is specifted, the attribute vvill 


be ignored.) 


The default value for “min” is "0". This does not constrain the active duration at all. 

Except for any SVG-specific rules explicitly mentioned in this specification, the normative definition 
for this attribute is the SMIL Animation specification. In particular, see SMIL Animation: "min: attribute 
(İSMILANIM)), section 3.3.3). 


max £ Clock-value I "media" 
Specifles the maximum value of the active duration. 
"The attribute value can be either of the follovving: 


Clock-value 
Speciftes the length of the maximum value of the active duration, measured in local time. 
Value must be greater than 0. 


"media" 
Specifies the maximum value of the active duration as the intrinsic media duration. This is only valid 
for elements that define media. (For SVG"s animation elemenis, if "media" is specifted, the attribute vvill 


be ignored.) 


"There is no default value for “max”. This does not constrain the active duration at all, 

Except for any SVG-specific rules explicitly mentioned in this specification, the normative definition 
for this attribute is the SMIL Animation specification. In particular, see SMIL Animation: "max" attribute 
(ISMILANIM), section 3.3.3). 


restart — "alvvays" / "vhenNotActive" I "never" 


alvvays 
"The animation can be restarted at any time. 
"This is the default value. 


vvhenNotActive 
"The animation can only be restarted vvhen it is not active (i.e. after the active end). Attempts to restart 
the animation during its active duration are ignored. 


never 
"The element cannot be restarted for the remainder of the current simple duration of the parent time 
container. (In the case of SVG, since the parent time container is the SVG document fragment, then the 
animation cannot be restarted for the remainder of the document duration.) 
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Except for any SVG-specific rules explicitly mentioned in this specification, the normative definition for 
this attribute is the SMIL Animation specification. In particular, see SMIL Animation: Testart" attribute 
(İSMILANIM)), section 3.3.7). 


repeatCount  numeric value 1 "indefinite" 
Specifies the number of iterations of the animation function. İt can have the follovving attribute values: 


numeric value 
"This is a (base 10) "floating point" numeric value that specifies the number of iterations. İt can include 
partial iterations expressed as fraction values. A fractional value describes a portion of the simple dur- 





ation. Values must be greater than 0. 


"indefinite" 
The animation is defined to repeat indefinitely (i.e. until the document ends). 


Except for any SVG-specific rules explicitly mentioned in this specification, the normative definition for this 
attribute is the SMIL Animation specification. In particular, see SMIL Animation: "TepeatCount" attribute 
(İSMILANIMİ), section 3.3.1). 


repeatDur £ Clock-value 1 "indefinite" 
Speciftes the total duration for repeat. It can have the follovving attribute values: 


Clock-value 
Speciftes the duration in presentation time to repeat the animation function f(t). 


"indefinite" 
The animation is defined to repeat indefinitely (i.e. until the document ends). 


Except for any SVG-specific rules explicitly mentioned in this specification, the normative definition for 
this attribute is the SMIL Animation specification. In particular, see SMIL Animation: TepeatDur" attribute 
(İSMILANIM)), section 3.3.1). 


fill — "freeze" "remove" 
"This attribute can have the follovving values: 


freeze 
The animation effect F(t) is defined to freeze the effect value at the last value of the active duration. 
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The animation effect is "frozen" for the remainder of the document duration (or until the animation is 
restarted - see SMIL Animation: Restarting animation). 


remove 
The animation effect is removed (no longer applied) vvhen the active duration of the animation is over. 
After the active end of the animation, the animation no İlonger affects the target (unless the animation 
is restarted - see SMIL Animation: Restarting animation). 
"This is the default value. 


Except for any SVG-specific rules explicitly mentioned in this specification, the normative definition for 
this attribute is the SMIL Animation specification. In particular, see SMIL Animation: "İli" attribute 
(İSMILANIM), section 3.3.5). 


The SMIL Animation specification (İSMILANIM) defines the detailed processing rules associated vvith the above 


attributes. Except for any SVG-specific rules explicitly mentioned in this specification, the SMIL Animation spe- 
cification is the normative definition of the processing rules for the above attributes. 


19.2.8.1 Clock values 


Clock values have the same syntax as in SMİIL Animation specification İSMILANIMI. The grammar for clock val- 
ues is repeated here: 


Clock-val :- Full-clock-val 1 Partial-clock-val 
İ Timecount-val 

Ful1-clock-val :e Hours ":" Minutes ":" Seconds ("." Fraction)? 

Partial-clock-val ::- Minutes ":" Seconds ("." Fraction)? 

Timecount-val :- Timecount ("." Fraction)? (Metric)? 

Metric :e "h" 1 "min" İ "s" 1 "ms" 

Hours :- DİGİT-, any positive number 

Minutes :- 2DİGİT, range Trom 00 to 59 

Seconds :- 2DİGİT, range Trom 00 to 59 

Fraction :z DİGİTE 

Timecount :z DİGİTE 

2DIGIT :e DIGİT DİGİT 

DIGIT :z 10-9) 


For Timecount values, the default metric suffix is "s" (for seconds). No embedded vvhite space is allovved in clock 
values, although leading and trailing vvhite space characters vvill be ignored. 

Clock values deseribe presentation time. 

The follovving are examples of legal clock values: 


e Full clock values: 
02:30:03 — 2 hours, 30 minutes and 3 seconds 
50:00:10.25 - 50 hours, 10 seconds and 250 milliseconds 
e Partial clock value: 
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02:33 - 2 minutes and 33 seconds 
00:10.5 - 10.5 seconds - 10 seconds and 500 milliseconds 
e Timecount values: 


3.2h - 3.2 hours - 3 hours and 12 minutes 
45min “— 45 minutes 

30s — 30 seconds 

5ms - 5 milliseconds 


12.467 - 12 seconds and 467 milliseconds 


Fractional values are fust (base 10) floating point definitions of seconds. Thus: 
00.5s z 500 milliseconds 
00:00.005 z 5 milliseconds 


19.2.9 Attributes that define animation values over time 


"The follovving attributes are the animation value attributes. They are common to elements “animate”, “animateCo- 


lor), “animateMotion” and “animateTransform”. These attributes define the values that are assigned to the target at- 
tribute or property over time. The attributes belovv provide control over the relative timing of keyframes and the 


interpolation method betvveen discrete values. 
Attribute definitions: 


calcMode  "discrete 1 linear İ paced 1 spline" 
Specifies the interpolation mode for the animation. "This can take any of the follovving values. The default 
mode is Tinear", hovvever if the attribute does not support linear interpolation (e.g. for strings), the “caleMode” 


attribute is ignored and discrete interpolation is used. 


discrete 
"This specifies that the animation function vvill fump from one value to the next vvithout any interpola- 
tion. 


linear 
Simple İinear interpolation betvveen values is used to caleulate the animation function. Except for “an- 
imateMotion,, this is the default “caleMode”?. 


paced 
Defines interpolation to produce an even pace of change across the animation. This is only supported 
for the data types for vvhich there is an appropriate distance function defined, vvhich includes only scal- 
ar numeric types plus the types listed in Paced animation and complex types. İf "paced" is specifted, any 
“keyTimes” or “keySplines” vvill be ignored. For “animateMotion?, this is the default “caleMode”. Authors 
are discouraged from using paced animation on types that do not have a distance function defined, due 
to its unpredictable behavior in some user agents. 


spline 
Interpolates from one value in the “values” list to the next according to a time function defined by a cu- 
bic Bezier spline. The points of the spline are defined in the “keyTimes” attribute, and the control points 
for each interval are defined in the “keySplines” attribute. 
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Except for any SVG-specific rules explicitly mentioned in this specification, the normative definition for 
this attribute is the SMIL Animation specification. In particular, see SMIL Animation: "caleMode: attribute 
(İISMILANIM), section 3.2.3). 


values z "zlist-" 
A semicolon-separated list of one or more values. Vector-valued attributes are supported using the vector 
syntax of the “attributeType” domain. Per the SMIL specification, leading and trailing vvhite space, and vvhite 
space before and after semicolon separators, is allovved and vvill be ignored. Except for any SVG-specific 





rules explicitly mentioned in this specification, the normative definition for this attribute is the SMIL Anim- 
ation specification. In particular, see SMIL Animation: "values" attribute ((SMILANIMI, section 3.2.2). 


keyTimes — "-list-" 
A semicolon-separated list of time values used to control the pacing of the animation. Each time in the list 
corresponds to a value in the “values” attribute list, and defines vvhen the value is used in the animation func- 
tion. Each time value in the “keyTimes” İist is specifted as a floating point value betvveen 0 and 1 (inclusive), 
representing a proportional offset into the simple duration of the animation element. 

For animations specifted vvith a “values” list, the “keyTimes” attribute if specifted must have exactly as 
many values as there are in the “values” attribute. For from/to/by animations, the “keyTimes” attribute if spe- 
cifled must have tvvo values. 

Each successive time value must be greater than or equal to the preceding time value. 

"The “keyTimes” list semantics depends upon the interpolation mode: 


e For İinear and spline animation, the first time value in the list must be 0, and the last time value in the 
list must be 1. The key time associated vvith each value defines vvhen the value is set, values are inter- 
polated betvveen the key times. 

e For discrete animation, the first time value in the list must be 0. The time associated vvith each value 
defines vvhen the value is set, the animation function uses that value until the next time defined in 


“keyTimes”. 


If the interpolation mode is "paced", the “keyTimes” attribute is ignored. 

If there are any errors in the “keyTimes” specification (bad values, too many or too fevv values), the doc- 
ument fragment is in error (see error processing). 

If the simple duration is indefinite, any “keyTimes” specification vvill be ignored. 

Because paced animation interpolation is unspecified for some value types, authors are encouraged to 
use "İinear" animation interpolation vvith calculated “keyTimes” to achieve particular interpolation behavior 
for these types. 

Except for any SVG-specific rules explicitly mentioned in this specification, the normative definition for 


this attribute is the SMIL Animation specification. In particular, see SMIL Animation: "keyTimes" attribute 
(İSMILANIMİ), section 3.2.3). 


keySplines  "-elist-" 
A set of Böezier control points associated vvith the “keyTimes” list, defining a cubic Bezier function that con- 
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trols interval pacing. 1he attribute value is a semicolon-separated list of control point descriptions. Each con- 
trol point description is a set of four values: x1 y1 x2 y2, describing the Bezier control points for one time 
segment. Note: SMIL allovvs these values to be separated either by commas vvith optional vvhitespace, or by 
vvhitespace alone. The “keyTimes” values that define the associated segment are the Bezier "anchor points", 
and the “keySplines” values are the control points. Thus, there must be one fevver sets of control points than 
there are “keyTimes”. 

"The values must all be in the range 0 to 1. 

"This attribute is ignored unless the “caleMode” is set to "spline". 





If there are any errors in the “keySplines” specification (bad values, too many or too fevv values), the 
document fragment is in error (see error processing). 

Except for any SVG-specific rules explicitly mentioned in this specification, the normative definition for 
this attribute is the SMIL Animation specification. In particular, see SMIL Animation: "keySplines" attribute 
(İISMILANIMİ), section 3.2.3). 


Trom — "-values" 
Specifies the starting value of the animation. 
Except for any SVG-specific rules explicitly mentioned in this specification, the normative definition for 
this attribute is the SMIL Animation specification. In particular, see SMIL Animation: "from" attribute 
(İSMILANIMİ), section 3.2.2). 


to — "-values" 
Speciftes the ending value of the animation. 
Except for any SVG-specific rules explicitly mentioned in this specification, the normative definition for 
this attribute is the SMIL Animation specification. In particular, see SMIL Animation: "to" attribute 
(İISMILANIMİ), section 3.2.2). 


by — "-values" 
Specifies a relative offset value for the animation. 
Except for any SVG-specific rules explicitly mentioned in this specification, the normative definition for 
this attribute is the SMIL Animation specification. In particular, see SMIL Animation: "by" attribute 
(İSMILANIM)), section 3.2.2). 


The SMIL Animation specification (İSMILANIM) defines the detailed processing rules associated vvith the above 
attributes. Except for any SVG-specific rules explicitly mentioned in this specification, the SMIL Animation spe- 
cification is the normative definition of the processing rules for the above attributes. 

The animation values specified in the animation element must be legal values for the specifted attribute. 
Leading and trailing vvhite space, and vvhite space before and after semicolon separators, vvill be ignored. 
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AİI values specified must be legal values for the specifted attribute (as defined in the associated namespace). 
If any values are not legal, the document fragment is in error (see error processing). 

If a list of values is used, the animation vvill apply the values in order over the course of the animation. Ifa 
list of “values” is specifted, any “from,, “to” and “by” attribute values are ignored. 

The processing rules for the variants of from/5y/to animations are described in Animation function values 
vvith the follovving exception. 

Im order to provide behavior that is intuitive and consistent betvveen discrete animations vvith an explicitly 
specifled “from” attribute (e.g. "From-to animation") and those vvhere the underlying value is used (e.g. "to anim- 
ation"), the behavior of discrete to-animation in SVG deviates from the definition in SMIL Animation. As vvith a 
discrete from-to animation, a discrete to animation vvill set the underlying value for the first half of the simple dur- 
ation (or, if a “keyTimes” list is provided, until the simple duration specified by the second value in the “keyTimes” 
list) and the “to” value for the remainder of the simple duration. 

The follovving figure illustrates the interpretation of the “keySplines” attribute. Each diagram illustrates the 
effect of “keySplines” settings for a single interval (i.e. betvveen the associated pairs of values in the “keyTimes” and 
“values” lists.). The horizontal axis can be thought of as the input value for the unif progress of interpolation vvithin 
the interval - i.e. the pace vvith vvhich interpolation proceeds along the given interval. The vertical axis is the res- 
ulting value for the unif progress, yielded by the function that the “keySplines” attribute defines. Another vvay of 
describing this is that the horizontal axis is the input unif time for the interval, and the vertical axis is the output 
unit time. See also the section Timing and real-vvorld clock times. 


Examples of keySplines 


(.5.1) (UD) 


(11) 
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(0.0) (5,0) 





(0,0) 














keySplinese".5 0 .5 1" 


keySplinesz"0 0 1 1" (the default) 





























(25.1) (1,1) ——— (1,1) 
(0,.75) 
((25,.25) 
(1/0) 
(0,0) (0,0) 
) 
keySplinese"0 .75 .25 1" keySplinese"1 0 .25 .25" 


To illustrate the calculations, consider the simple example: 


xanimate durz"4s" valuese"10, 20" keyTimese"0, 1" 
calcMode-"spline" keySplines-(as in table) /” 


Using the “keySplines” values for each of the four cases above, the approximate interpolated values as the animation 
proceeds are: 


Value of “keySplines” Initial value After 15 After 2s After 3s Final value 


0011 10.0 12.5 15.0 17.5 20.0 
.50.51 10.0 11.0 15.0 19.0 20.0 
0.75.251 10.0 18.0 19.3 19.8 20.0 


10.25.25 10.0 10.1 10.6 16.9 20.0 
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For a formal definition of Bözier spline calculation, see EFOLEY-VANDAM), pp. 488-491. 


19.2.10 Attributes that control vvhether animations are additive 


İt is frequently useful to define animation as an offset or delta to an attribute"s value, rather than as absolute 
values. A simple "grovv" animation can increase the vvidth of an obfect by 10 pixels: 


xrect vidth-"20px" ...s 
xanimate attributeNamez"vidth" from-"6px" toz"10px" durz"10s" 
additiveze"sum"/5 
c/ recto 


İt is frequently useful for repeated animations to build upon the previous results, accumulating vvith each intera- 
tion. The follovving example causes the rectangle to continue to grovv vvith each repeat of the animation: 


xrect vidth-"20px" ...s 
xanimate attributeNamez-"vidth" fTrom-"6px" toz"10px" durz"10s" 
additiveze"sum" accumulateze"sum" repeatCounte"5"/5 
c/rect” 


At the end of the first repetition, the rectangle has a vvidth of 30 pixels. At the end of the second repetition, the 
rectangle has a vvidth of 40 pixels. At the end of the fifth repetition, the rectangle has a vvidth of 70 pixels. 

For more information about additive animations, see SMIL Animation: Additive animation. For more inform- 
ation on cumulative animations, see SMIL Animation: Controlling behavior of repeating animation - Cumulative 
animation. 

The follovving attributes are the animation addition attributes, vvhich are common to elements “animate”, 


“animateColor”, “animateMotion” and “animateTransform”. 
Attribute definitions: 


additive — "replace / sum" 
Controls vvhether or not the animation is additive. 


sum 
Speciftes that the animation vvill add to the underlying value of the attribute and other İlovver priority 
animations. 


replace 
Speciftes that the animation vvill override the underlying value of the attribute and other lovver priority 
animations. This is the default, hovvever the behavior is also affected by the animation value attributes 
“by” and “to”, as described in SMIL Animation: Hovv from, to and by attributes affect additive behavior. 


Except for any SVG-specific rules explicitly mentioned in this specification, the normative definition for 
this attribute is the SMIL Animation specification. In particular, see SMIL Animation: "additive" attribute 
(İSMILANIM), section 3.3.6). 
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accumulate — "none İl sum" 
Controls vvhether or not the animation is cumulative. 


sum 
Specifies that each repeat iteration after the first builds upon the last value of the previous iteration. 


none 
Speciftes that repeat iterations are not cumulative. This is the default. 


"This attribute is ignored if the target attribute value does not support addition, or if the animation element 
does not repeat. 

Cumulative animation is not defined for "fo animation". 

"This attribute vvill be ignored if the animation function is specifted vvith only the “to” attribute. 

Except for any SVG-specific rules explicitly mentioned in this specification, the normative definition for 
this attribute is the SMIL Animation specification. In particular, see SMIL Animation: "accumulate" attribute 
(İSMILANIM), section 3.3.1). 


19.2.11 Inheritance 


SVG allovvs both attributes and properties to be animated. İf a given attribute or property is inheritable by des- 
cendants, then animations on a parent element such as a “g” element has the effect of propagating the attribute 
or property animation values to descendant elements as the animation proceeds, thus, descendant elements can 
inherit animated attributes and properties from their ancestors. 


19.2.12 The “animate” element 


"The “animate” element is used to animate a single attribute or property over time. For example, to make a rectangle 
repeatedly fade avvay over 5 seconds, you can specify: 
xrectə” 
xanimate attributeTypez"CSS" attributeNameze"opacity" 


Trome"1" toz"0" durz"5s" repeatCounte"indefinite" /s 
c/rect” 


Except for any SVG-specific rules explicitly mentioned in this specification, the normative definition for this ele- 
ment is the SMIL Animation specification. In particular, see SMIL Animation: "animate" element ((SMILANIMI, 


section 4.1). 


Categories: “animate” 


Animation element 


Content model: 
Any number of the follovving elements, in any order: 
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descriptive elements 


Attributes: 
conditional processing attributes 
core attributes 
animation event attributes 
xlink attributes 
animation attribute target attributes 
animation timing attributes 
animation value attributes 
animation addition attributes 
presentation attributes 
“externalResourcesRequired” 


DOM Tnterfaces: 
SVGAnimateElement 


"The “color-interpolation” property applies to color interpolations that result from animations using the “animate” 
element. 

For a list of attributes and properties that can be animated using the “animate” element, see Elements, attrib- 
utes and properties that can be animated. 


19.2.13 The “set element 


"The “set” element provides a simple means of fust setting the value of an attribute for a specifted duration. It sup- 
ports all attribute types, including those that cannot reasonabİy be interpolated, such as string and boolean values. 
"The “set” element is non-additive. The additive and accumulate attributes are not allovved, and vvill be ignored if 
specifted. 

Except for any SVG-specific rules explicitly mentioned in this specification, the normative definition for this 
element is the SMIL Animation specification. In particular, see SMIL Animation: "set" element (TSMILANIM), sec- 
tion 4.2). 


Categories: ... 
Animation element 


Content model: 
Any number of the follovving elements, in any order: 
descriptive elements 


Attributes: 
conditional processing attributes 
core attributes 
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animation event attributes 

xlink attributes 

animation attribute target attributes 
animation timing attributes 
“externalResourcesRequired” 


, 


“to 


DOM Interfaces: 
SVGSetElement 


Attribute definitions: 


to — "-values" 
Speciftes the value for the attribute during the duration of the “set” element. The argument value must match 
the attribute type. 


For a list of attributes and properties that can be animated using the “set” element, see Elements, attributes and 


properties that can be animated. 


19.2.14 The “animateMotion” element 


The “animateMotion” element causes a referenced element to move along a motion path. 

Except for any SVG-specific rules explicitly mentioned in this specification, the normative definition for 
this element is the SMIL Animation specification. In particular, see SMIL Animation: "animateMotion" element 
(İSMILANIM)), section 4.3). 


Categories: “animateMotion” 
Animation element 


Content model: 
Any number of deseriptive elements and at most one “mpath” element, in any order. 


Attributes: 
conditional processing attributes 
core attributes 
animation event attributes 
xlink attributes 
animation timing attributes 
animation value attributes 
animation addition attributes 


“externalResourcesRequired” 
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“path” 
“keyPoints” 
“rotate” 
“origin” 
DOM Tnterfaces: 
SVGAnimateMotionElement 


Attribute definitions: 


calcMode  "discrete 1 linear İ paced 1 spline" 
Specifies the interpolation mode for the animation. Refer to general description of the “caleMode” attribute 
above. The only difference is that the default value for the “caleMode” for “animateMotion” is "paced", See SMIL 


Animation: "caleMode" attribute for "animateMotion", 


path  "-path-datas" 
The motion path, expressed in the same format and interpreted the same vvay as the “d” attribute on the 
“path” element. The effect of a motion path animation is to add a supplemental transformation matrix onto 
the CTM for the referenced obiect vvhich causes a translation along the x- and y-axes of the current user 
coordinate system by the computed X and Y values computed over time. 


keyPoints  "-list-of-numberss" 

“keyPoinis” takes a semicolon-separated list of floating point values betvveen 0 and 1 and indicates hovv far 
along the motion path the obiect shall move at the moment in time specified by corresponding “keyTimes” 
value. Distance calculations use the user agent"s distance along the path algorithm. Each progress value in 
the list corresponds to a value in the “keyTimes: attribute list. 

If a İst of “keyPoinis” is specifled, there must be exactly as many values in the “keyPoinis” İist as in the 
“keyTimes” İist. 

If there are any errors in the “keyPoinis” specification (bad values, too many or too fevv values), then the 


document is in error (see Error processing). 


rotate — "-number” İ auto / auto-reverse" 
"The “Trotate” attribute post-multiplies a supplemental transformation matrix onto the CTM of the target ele- 
ment to appİy a rotation transformation about the origin of the current user coordinate system. The rota- 
tion transformation is applied after the supplemental translation transformation that is computed due to the 
“path” attribute. 


auto 
Imdicates that the obiect is rotated over time by the angle of the direction (i.e., directional tangent vec- 
tor) of the motion path. 
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auto-reverse 
Indicates that the obiect is rotated over time by the angle of the direction (i.e., directional tangent vec- 
tor) of the motion path plus 180 degrees. 


enumber”- 
Indicates that the target element has a constant rotation transformation applied to it, vvhere the rota- 
tion angle is the specifted number of degrees. 


The default value is "0. 


origin — "default" 
"The “origin” attribute is defined in the SMIL Animation specification ((SMILANIM), section 4.3). It has no 


effect in SVG. 


Categories: “mpath” 
None 


Content model: 
Any number of the follovving elements, in any order: 
descriptive elements 


Attributes: 
core attributes 
xlink attributes 
“externalResourcesRequired” 
“xlink:href” 


DOM Tnterfaces: 
SVGMPathElement 


Attribute definitions: 


xlink:href — "-iri-" 
An IRI reference to the “path” element vvhich defines the motion path. 
Animatable: no. 


For “animateMotion”, the specifted values for “from”, “by”, “to” and “values” consists of x, y coordinate pairs, vvith a 
single comma and/or vvhite space separating the x coordinate from the y coordinate. For example, from-"33,15" 
speciftes an x coordinate value of 33 and a y coordinate value of 15. 

If provided, the “values” attribute must consists of a list of x, y coordinate pairs. Coordinate values are separ- 
ated by at least one vvhite space character or a comma. Additional vvhite space around the separator is allovved. For 
example, values-"10,20:30,20:30,40" or values-"10mm,20mm:30mm,20mm:30mm,40mm". Each coordinate represents a 
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length. Attributes “from?, “by”, “to” and “values” specify a shape on the current canvas vvhich represents the motion 
path. 
Tevo options are available vvhich allovv definition of a motion path using any of SVGss path data commands: 


e the “path” attribute defines a motion path directly on “animateMotion” element using any of SVG"s path data 
commands. 

e the “mpath” sub-element provides the ability to reference an external “path” element as the definition of the 
motion path. 


Note that SVG"s path data commands can only contain values in user space, vvhereas “from”, “by”, “to” and “values” 
can specify coordinates in user space or using unit identifters. See Units. 

The various (x,y) points of the shape provide a supplemental transformation matrix onto the CTM for the 
referenced obyect vvhich causes a translation along the x- and y-axes of the current user coordinate system by the 
(x,y) values of the shape computed over time. Thus, the referenced obiect is translated over time by the offset of 
the motion path relative to the origin of the current user coordinate system. The supplemental transformation is 
applied on top of any transformations due to the target elements “transform” attribute or any animations on that 
attribute due to “animateTransform” elements on the target element. 

The “additive” and “accumulate” attributes apply to “animateMotion” elements. Multiple “animateMotion” ele- 
ments all simultaneously referencing the same target element can be additive vvith respect to each other, hovvever, 
the transformations vvhich result from the “animateMotion” elements are alvvays supplemental to any transforma- 
tions due to the target elements “transform” attribute or any “animateTransform” elements. 

The default caleulation mode (“caleMode”) for “animateMotion: is "paced". This vvill produce constant velocity 
motion along the specifted path. Note that vvhile animateMotion elements can be additive, it is important to ob- 
serve that the addition of tvvo or more "paced" (constant velocity) animations might not result in a combined mo- 
tion animation vvith constant velocity. 

VVhen a path is combined vvith "discrete", "linear" or "spline" “caleMode: settings, and if attribute “keyPoints” 
is not provided, the number of values is defined to be the number of points defined by the path, unless there are 
"move to" commands vvithin the path. A "move to" command vvithin the path (i.e. other than at the beginning of 
the path description) A "move to" command does not count as an additional point vrhen dividing up the duration, 
or vvhen associating “keyTimes”, “keySplines” and “keyPoints” values. VVhen a path is combined vvrith a "paced" “cal- 
cMode: setting, all "move to" commands are considered to have 0 length (i.e. they alvvays happen instantaneousily), 
and is not considered in computing the pacing. 

For more flexibility in controlling the velocity along the motion path, the “keyPoinis” attribute provides the 
ability to specify the progress along the motion path for each of the “keyTimes” specifted values. If specifted, 
“keyPoints” causes “keyTimes” to apply to the values in “keyPoints” rather than the points specifted in the “values” 
attribute array or the points on the “path” attribute. 

The override rules for “animateMotion” are as follovvs. Regarding the definition of the motion path, the “mpath” 
element overrides the the “path” attribute, vvhich overrides “values”, vvhich overrides “from”, "by” and “to”. Regard- 
ing determining the points vvhich correspond to the “keyTimes” attributes, the “keyPoints” attribute overrides “path”, 
vvhich overrides “values”, vvhich overrides “from”, “by” and “to”. 

At any time £ vvithin a motion path animation of duration dur, the computed coordinate (x,y) along the mo- 


tion path is determined by finding the point (x,y) vvhich is £/dur distance along the motion path using the user 
agent"s distance along the path algorithm. 

The follovvring example demonstrates the supplemental transformation matrices that are computed during a 
motion path animation. 
Example animMotion01 shovvs a triangle moving along a motion path. 
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x?xml versionze"1.0" standalonez"no"?s 
x DOCTYPE svg PUBLİC "-//03C//DTD SVG 1.1//EN" 
"http: // /vvvv .v3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
€svg vidth-"5cm" height-"3cm" vievBoxz"0 0 500 300" 
xmlnse"http://vuv.v3.0rg/2000/svg" versionz"1.1" 
xmlns:xlinke"http:/ /vuvv.v3.org/1999/x1ink" s 
edescsExample animMotion01 - demonstrate motion animation computations-/desc” 
xrect xe"1" yz"1" vidth-"498" height-"298" 
fill-"none" strokez"blue" stroke-vidthz"2" /s 
c1-- Drav the outline of the motion path in blue, along 
vith three small circles at the start, middle and end. --” 
cpath id-"path1" d-"M100,250 C 100,50 400,50 400,250" 
fill-"none" strokez-"blue" stroke-vidth-"7.06" /” 
ccircle cxz"100" cyz"250" rz"17.64" fill-"blue" /s 
ccircle cxz"250" cyz"100" rz"17.64" fill-"blue" /s 
ccircle cxz"400" cyz"250" re"17.64" fill-"blue" /s 
c1-- Here is a triangle uhich vill be moved about the motion path. 
It is defined vith an upright orientation vith the base of 
the triangle centered horizontally iİust above the origin. --s 
xpath d-"M-25,-12.5 L25,-12.5 L 0,-87.5 z" 
fill-"yellov" strokez"red" stroke-vidth-"7.06" xs 
c1-- Define the motion path animation --xs 
canimateMotion dur-"6s" repeatCounte"indefinite" rotatez"auto" x 
empath xlink:hrefz"iöpath1"/5 


























c/animateMotion” 
c/path” 
x/ svg” 
Example animMotion01 
At zero seconds At three seconds At six seconds 


"The follovving table shovvs the supplemental transformation matrices that are applied to achieve the effect of the 


motion path animation. 
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After 0s AYİ After 6s 
Supplemental transform due to movement along translate(100,250) translate(250,100) translate(400,250) 
motion path 
Supplemental transform due to rotate-"auto" rotate(-90) rotate(0) rotate(90) 


For a list of elements that can be animated using the “animateMotion” element, see Elements, attributes and prop- 
erties that can be animated. 


19.2.15 The “animateColor” element 





The “animateColor” element speciftes a color transformation over time. 

Except for any SVG-specific rules explicitly mentioned in this specification, the normative definition for 
this element is the SMIL Animation specification. In particular, see SMIL Animation: "animateColor" element 
(İSMILANIM)), section 4.4). 


Categories: “animateColor” 
Animation element 


Content model: 
Any number of the follovving elements, in any order: 
descriptive elements 


Attributes: 
conditional processing attributes 
core attributes 
animation event attributes 
xlink attributes 
animation attribute target attributes 
animation timing attributes 
animation value attributes 
animation addition attributes 
presentation attributes 
“externalResourcesRequired” 


DOM Tnterfaces: 
SVGA nimateColorElement 


"The “from”, “by” and “to” attributes take color values, vvhere each color value is expressed using the follovving syntax 
(the same syntax as used in SVG“s properties that can take color values): 


ccolorx cicccolors? 
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The “values” attribute for the “animateColor” element consists of a semicolon-separated list of color values, vvith 
each color value expressed in the above syntax. 

Out of range color values can be provided, but user agent processing vvill be implementation dependent. User 
agents should clamp color values to allovv color range values as late as possible, but note that system differences 
might preclude consistent behavior across different systems. 

The “color-interpolation” property applies to color interpolations that result from “animateColor” animations. 

The use of “animateColor” is deprecated, since all of its functionality can be achieved simply by using “animate” 
to target properties that can take color values. The “animateColor” element may be dropped from a future version 
of the SVG specification. 

For a list of attributes and properties that can be animated using the “animateColor” element, see Elements, 
attributes and properties that can be animated. 


19.2.16 The “animateTransform” element 


The “animateTransform” element animates a transformation attribute on a target element, thereby allovving anima- 


tions to control translation, scaling, rotation and/or skevving. 


Categories: “animateTransform” 
Animation element 


Content model: 
Any number of the follovving elements, in any order: 
descriptive elements 


Attributes: 
conditional processing attributes 
core attributes 
animation event attributes 
xlink attributes 
animation attribute target attributes 
animation timing attributes 
animation value attributes 
animation addition attributes 
“externalResourcesRequired” 


ə 
DOM Tnterfaces: 
SVGA nimateTransformElement 
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Attribute definitions: 


type - "translate İl scale İ rotate / skevvX İ skevvY" 
Imdicates the type of transformation vvhich is to have its values change over time. If the attribute is not spe- 
cifled, then the effect is as if a value of "translate" vvere specifted. 


"The “from?, by” and “to” attributes take a value expressed using the same syntax that is available for the given 


transformation type: 


e For a type-"translate", each individual value is expressed as -txx Lety”1. 

e For a type-"scale", each individual value is expressed as -sxə- L-sy”l. 

e For a type-"rotate", each individual value is expressed as -rotate-angles f-ex? -ey?l. 

e For a type-"skevvX" and type-"skevvY", each individual value is expressed as -skevv-angles. 


(See The “transform: attribute.) 

The “values” attribute for the “animateTransform” element consists of a semicolon-separated list of values, 
vvhere each individual value is expressed as described above for “from”, “by” and “to”. 

The animation effect for “animateTransform” is post-multiplied to the underlying value for additive “anim- 
ateTransform” animations (see belovv) instead of added to the underlying value, due to the specific behavior of 
“animateTransform”. 

From-to, from-by and by animations are defined in SMIL to be equivalent to a corresponding values anima- 
tion. See the Animation function values section of SMIL Animation (TSMILANIM), section 3.2.2). Hovvever, fo an- 
imations are a mixture of additive and non-additive behavior, as described in the Hovv from, to and by attributes 
affect additive behavior section of SMIL Animation (TSMILANIM), section 3.3.6). To animations provide specific 
functionality to get a smooth change from the underlying value to the “to” attribute value, vvhich conflicts math- 
ematically vvith the requirement for additive transform animations to be post-multiplied. As a consequence, in 
SVG 1.1 the behavior of fo animations for “animateTransform” is undefined. Authors are suggested to use from-fo, 
from-by, by or values animations to achieve any desired transform animation. 

If “caleMode” has the value Taced", then the "distance" for the transformation is calculated as further described 
in Paced animations and complex types. 

VVhen an animation is active, the effect of non-additive “animateTransform” (i.e., additive-"replace") is to re- 
place the given attribute"s value vvith the transformation defined by the “animateTransform”. The effect of additive 
(i.e., additive-"sum") is to post-multiply the transformation matrix corresponding to the transformation defined by 


this “animateTransform”. To illustrate: 


xrect transform-"skevX(30)"...5 
canimateTransform attributeName-"transform" attributeTypeze"XML" 
typez"rotate" from-"0" toz"90" durz"5s" 
additivee"replace" fill-"fTreeze"/s 
xanimateTransform attributeNamez"transform" attributeTypez"XML" 
typee"scale" frome"1" toz"2" durze"5s" 
additivee"replace" fill-"fTreeze"/s 
v/ recte 
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m the code snippet above, because the both animations have additive-"replace", the first animation overrides the 
transformation on the rectangle itself and the second animation overrides the transformation from the first an- 
imation, therefore, at time 5 seconds, the visual result of the above tvvo animations vvould be equivalent to the 


follovving static rectangle: 


cerect transform-"scale(2)" ... /əs 


vvhereas in the follovving example: 


cerect transform-"skev/X(30)"...s 
canimateTransform attributeName-"transform" attributeTypeze"XML" 
typez"rotate" fTrom-"0" toz"90" durz"5s" 
additivez"sum" fill-"freeze"/s 
canimateTransform attributeName-"transform" attributeTypere"XML" 
typez"scale" frome"1" toz"2" durze"5s" 
additivez"sum" fill-"freeze"/s 
c/rects 


In this code snippet, because the both animations have additive-"sum", the first animation post-multiplies its trans- 
formation to any transformations on the rectangle itself and the second animation post-mulltiplies its transforma- 
tion to any transformation from the first animation: therefore, at time 5 seconds, the visual result of the above tvvo 
animations vvould be equivalent to the follovving static rectangle: 


crect transform-"skev/X(30) rotate(90) scale(2)" ... /s 


Note that the zero value used vvhen performing a by animation vvith type-"scale" is indeed 0. Thus, performing 
the follovving animation causes the rectangle to be invisible at time 0s (since the animated transform list value is 
"scale(0)"), and be scaled back to its original size at time 5s (since the animated transform list value is "scale(1)"): 


crect vidth-"100" height-"100"- 
canimateTransform attributeName-"transform" attributeTypeze"XML" 
typese"scale" bye"1" dure"5s" fill-"freeze"/5 
c/rects 


VVhen a transform animation has accumulate-"sum", the accumulation that occurs for each completed repetition of 
the animation is computed on the values specifted in the “animateTransform” elements animation value attributes 
(i.e., “values”, “from”, “to” and “by”) and not on the transformation matrix that these values represent. For example, 
in the follovving code snippet, 3 is added to the scale value at the start of each repetition: 


crect vidth-"100" height-"100"- 
canimateTransform attributeName-"transform" attributeTypeze"XML" 
typez"scale" frome"2" toz"3" repeatCounte"3" dure"4s" 
fill-"fTreeze"/s 
c/ recto 


The follovving graph and table shovvs the animated “transform” value on the “rect” over the course of the animation: 
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Time Value 
E İ Time: Vali 


0s scale(2) 


1s scale(2.25) 


11 

10 2s scale(2.5) 
9 3s scale(2.75) 
8 2 4s scale(5) 
7 5s scale(5.25) 
6 — 6s scale(5.5) 
5 7s scale(5.75) 
: 8s scale(8) 
. 9s scale(8.25) 
: 10s scale(8.5) 
0 time 11s scale(8.75) 

0 2 4 6 8 10 12 14 16 125 scale(9) 


Transform item types that can have multiple values — "translate", "scale" and "rotate" — are treated as vectors and 
accumulation is performed vvith vector addition. Optional values that are omitted are taken to have their usual 
implied value: 1 for the -sy” component of a "scale" and 0 for the -ix” component of a "translate" and the -ex ey” 
components of a "rotate". 

For example, consider the follovving code snippet, vvhich has a cumulative transform animation of type To- 
tate": 

crect vidth-"100" height-"100"- 

xanimateTransform attributeNamez"transform" attributeTypez"XML" 
typee"rotate" from-"0 30 40" toz"10 30 40" 


repeatCounte"2" dure"1s" fill-"freeze"/s 
c/rectəe 


At time 1 second, the animated value of “transform” on the “rect” vvill Pump from "rotate(10 30 40)" to "Totate(10 60 
80)", because the effect of the accumulation is to take the value at the end of the first repetition, "10 30 40", and add 
to it the value at simple duration £ - 0s, vvhich is "0 30 40". 

For a list of attributes and properties that can be animated using the “animateTransform” element, see Ele- 
ments, attributes and properties that can be animated. 


19.2.17 Elements, attributes and properties that can be animated 


The follovving lists all of the elements vvhich can be animated by an “animateMotion” element: 
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. “SV 

. g” 

e “defs” 

e “use” 

ə “image” 

e “svvitch” 

e “path” 

e “rect” 

e “circle” 

e “ellipse” 

e “İine” 

e “polyline” 
e “polygon” 
e “text” 

e “clipPath” 
e “mask” 

e “a” 


e “foreignObiect” 


Each attribute or property vvithin this specification indicates vvhether or not it can be animated by SVG"s animation 
elements. Animatable attributes and properties are designated as follovvs: 
Animatable: yes. 
vvhereas attributes and properties that cannot be animated are designated: 
Animatable: no. 
Some properties are defined as being animatable but only for non-additive animations: 
Animatable: yes (non-additive). 

SVG has a defined set of basic data types for its various supported attributes and properties. For those attrib- 
utes and properties that can be animated, the follovving table indicates vvhich animation elements can be used to 
animate each of the basic data types. If a given attribute or property can take values of keyvvords (vvhich are not 
additive) or numeric values (vvhich are additive), then additive animations are possible if the subsequent anima- 
tion uses a numeric value even if the base animation uses a keyvvord value: hovvever, if the subsequent animation 
uses a keyvvord value, additive animation is not possible. 
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MEİCBA Zə Additive? “animate” ” “animateColor” “animateTransform” 

xangles yes yes yes no no 

ccolorx- yes yes yes yes no Only additive if each 
value can be converted 
to an RGB color. 

xcoordinate” yes yes yes no no 

xİrequency” no no no no no 

xintegerə yes yes yes no no 

clengthə- yes yes yes no no 

xlist-of- Ts” no yes yes no no 

xnumber yes yes yes no no 

xpaint- yes yes yes yes no Only additive if each 
value can be converted 
to an RGB color. 

xpercentage” yes yes yes no no 

xtime” no no no no no 

xtransform-liste” yes no no no yes Additive means that a 
transformation is 
post-multiplied to the 
base set of 
transformations. 

xiris no yes yes no no 

AİI other data no yes yes no no 

types used in 

animatable 

attributes and 

properties 


Any deviation from the above table or other special note about the animation capabilities of a particular attribute 
or property is included in the section of the specification vvhere the given attribute or property is defined. 
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19.3 Animation using the SVG DOM 


Example domü1 shovvs a simple animation using the DOM. 


x?xml versionze"1.0" standalonez"no"?s 
x IDOCTYPE svg PUBLİC "-//3C//DTD SVG 1.1//EN" 
"http: /vvvv .v3.org/Graphics/SVG/1.1/DTD/svg11.dtd"z 
csvg vidth-"4cm" height-"2cm" vievBoxz"0 0 400 200" 
xmlnsze"http: / /vuv/.v3.0T9/2000/svg" 
onload-"StartAnimation(evt)" versionz"1.1"5 
xscript typeze"application/ecmascript"”-I TCDATAT 
var timevalue z 0, 
var timer increment c 50, 
var max time 5000, 
var text element, 
function StartAnimation(evt) 1 
text element — evt.target.ovnerDocument .getElementBy1d("TextElement"), 
ShovAndGrovElement () , 
1 
function ShovAndGrovElement () 1 
timevalue - timevalue 4 timer increment, 
if (timevalue s max time) 
return, 
// Scale the text string gradually until it is 20 times larger 
scalefactor - (timevalue ” 20.) / max time, 
text element .setAttribute("transform", "scale(" 4 scalefactor H ")"), 
// Make the string more opaque 
opacityfactor £ timevalue / max time, 
text element.setAttribute("opacity", opacityfactor), 
// Call ShovAndörovElement again -ctimer increment- milliseconds later. 
setTimeout ( "ShovAndörovElement()", timer increment) 


vindov.ShovAndGrovElement - ShovAndGrovElement 
11-c/script” 
crect xe"1" ye"1" vidth-"398" height-"198" 
fill-"none" strokeze"blue" stroke-vidthe"2"/- 
€g transforme-"translate(50,150)" fill-"red" font-sizez"7"s 
etext id-"TextElement"”SV6G-/ text” 








x/gz 
x/ svg” 
Example dom01 
At zero seconds At 2.5 seconds At five seconds 


"The above SVG file contains a single graphics element, a text string that says "SVG". "The animation loops for 5 
seconds. The text string starts out small and transparent and grovvs to be large and opaque. Here is an explanation 


of hovv this example vvorks: 
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e "The onload-"StartAnimation(evt)" attribute indicates that, once the document has been fully loaded and pro- 
cessed, invoke ECMASeript function StartAnimation. 

e "The “script” element defines the ECMASeript vvhich makes the animation happen. The StartAnimation() 
function is only called once to give a value to global variable text element and to make the initial call to 
ShovAndGrovElement (). ShovAndGrovElement () is called every 50 milliseconds and resets the “transform” 
and “style” attributes on the text element to nevv values each time it is called. At the end of ShovAndGrovEle- 
ment, the function tells the ECMASeript engine to call itself again after 50 more milliseconds. 

e "he “g element shifts the coordinate system so that the origin is shifted tovvard the lovver-left of the vievving 
area. It also defines the fill color and font-size to use vvhen dravving the text string. 

e "The “text” element contains the text string and is the element vvhose attributes get changed during the anim- 


ation. 


If seripts are modifying the same attributes or properties that are being animated by SVGss animation elements, 
the scripts modify the base value for the animation. If a base value is modifted vvhile an animation element is 
animating the corresponding attribute or property, the animations are required to adiust dynamically to the nevv 
base value. 

If a seript is modifying a property on the override style sheet at the same time that an animation element is 
animating that property, the result is implementation-dependent: thus, it is recommended that this be avoided. 


19.4 DOM interfaces 


Belovv are the DOM interfaces for the elements defined in this chapter. In addition, ElementTimeControl and 
TimeEvent, vvhich are from SMIL Animation, are included here for easy reference. 


19.4.1 Interface ElementTimeControl 


SMIL Animation supports several methods for controlling the behavior of animation: beginElement(), be- 
ginElementAt (), endElement () and endElementAt (). These methods are used to begin and end the active dur- 
ation of an element. Authors can (but are not required to) declare the timing to respond to the DOM using the 
follovving syntax: 


canimate begin-"indefinite" end-"indefinite" .../s 


Ifa DOM method call is made to begin or end the element (using beginElement (), beginElementAt (), endEle- 
ment () or endElementAt ()), each method call creates a single instance time (in the appropriate instance times 
list). These times are then interpreted as part of the semantics of lists of times, as described in Evaluation of begin 
and end time lists. 


e "The instance time associated vvith a beginElement () or endElement () call is the current presentation time 
at the time of the DOM method call. 

e "The instance time associated vvith a beginElementAt () or endElementAt() call is the current presentation 
time at the time of the DOM method call, plus or minus the specifted offset. 


ə Note that beginElement() is subfect to the “restart” attribute in the same manner that event-based begin tim- 
ing is. Refer also to SMIL Animation: Restarting animation (İSMILANIM)), section 3.3.7). 


"The expectation of the follovving interface is that an instance of the ElementTimeControl interface can be obtained 
by using binding-specific casting methods on an instance of an animation element. A DOM application can use 
the hasFeature method of the DOMlmplementation interface to determine vvhether the ElementTimeControl in- 
terface is supported or not. The feature string for this interface is "TimeControl". 
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interface ElementTimeControl ( 
void beginElement(), 
void beginElementAt(in float offset), 
void endElement( ) 
void endElementAt(in float offset), 
ın 





Operations: 


e void beginElement() 


Creates a begin instance time for the current time. The nevv instance time is added to the begin instance 
times list. The behavior of this method is equivalent to beginElementAt (0). 


e void beginElementAtt(in float o/f/sef) 


Creates a begin instance time for the current time plus the specifted offset. The nevv instance time is added 
to the begin instance times list. 


Parameters 


e float of/seft 
The offset from the current document time, in seconds, at vvhich to begin the element. 


void endElement() 


Creates an end instance time for the current time. The nevv instance time is added to the end instance times 
list. The behavior of this method is equivalent to endElementAt (0). 


void endElementAtt(in float of7sef) 


Creates a end instance time for the current time plus the specified offset. The nevv instance time is added to 
the end instance times list. 


Parameters 


e float of/seft 
offset from the current document time, in seconds, at vvhich to end the element. 
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For the corresponding lava binding, see section 6.4 of SMIL Animation İSMILANIMI. 


19.4.2 Interface TimeEvent 


The TimeEvent interface, defined in SMIL Animation: Supported interfaces, provides specific contextual informa- 
tion associated vvith Time events. 
The different types of events that can occur are: 


beginEvent 
"This event is raised vvhen the element local timeline begins to play. İt vvill be raised each time the element 
begins the active duration (i.e. vvhen it restarts, but not vvhen it repeats). İt may be raised both in the course 
of normal (i.e. scheduled or interactive) timeline play, as vvell as in the case that the element vvas begun vvith 
the beginElement or beginElementAt methods. Note that if an element is restarted vvhile it is currently play- 
ing, the element vvill raise an end event and another begin event, as the element restarts. 


e Bubbles: No 
e Cancelable: No 
e Context Info: None 


endEvent 
"This event is raised at the active end of the element. Note that this event is not raised at the simple end of 
each repeat. This event may be raised both in the course of normal (i.e. scheduled or interactive) timeline 
play, as vvell as in the case that the element vvas ended vvith the endElement or endElementAt methods. Note 
that if an element is restarted vvhile it is currently playing, the element vvill raise an end event and another 


begin event, as the element restarts. 


e Bubbles: No 
e Cancelable: No 
e Context Info: None 


repeatEvent 
"This event is raised vyhen an element local timeline repeats. Tt vvill be raised each time the element repeats, 
after the first iteration. 
"The event provides a numerical indication of vvhich repeat iteration is beginning. The value is a 0-based in- 
teger, but the repeat event is not raised for the first iteration and so the observed values of the detail attribute 
vvill be x— 1. 


e Bubbles: No 


e Cancelable: No 
e Context Info: detail (current iteration) 


interface TimeEvent : Event 1 


readonly attribute AbstractViev viev, 
readonly attribute long detail, 


void initTimeEvent(in DOMString typeArg, in AbstractViev vievArg, in long detailArg), 
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Aftributes: 


e vievv (readonly AbstractVievv) 


"The vievv attribute identiftes the AbstractVievv İDOM2VTEVVS) from vvhich the event vvas generated. 


e detail (readonly long) 





Specifies some detail information about the Event, depending on the type of the event. For this event type, 
indicates the repeat number for the animation. 


Operations: 


e void initTimeEvent(in DOMString fypeArg, in AbstractVievv vievvArg, in long detailArg) 


The initTimeEvent method is used to initialize the value of a TimeEvent created through the DocumentEvent 
interface. This method may only be called before the TimeEvent has been dispatched via the dispatchEvent 
method, though it may be called multiple times during that phase if necessary. If called multiple times, the 
final invocation takes precedence. 


Parameters 


ə DOMsString iypeArg 
Specifies the event type. 


ə AbstractVievv viev/Arg 
Speciftes the Events AbstractVievv. 


ə long detailArg 
Speciftes the Events detail. 


For the corresponding lava binding, see section 6.4 of SMIL Animation İSMILANIMI. 


19.4.3 Interface SVGAnimationElement 


The SVGAnimationElement interface is the base interface for all of the animation element interfaces: SVGAn- 
imateElement, SVGSetElement, SVGAnimateColorElement, SVGAnimateMotionElement and SVGAnimateTrans- 
formElement. 

Unlike other SVG DOM interfaces, the SVG DOM does not specify convenience DOM properties correspond- 


ing to the various language attributes on SVG"s animation elements. Specification of these convenience properties 
in a vvay that vvill be compatible vvith future versions of SMIL Animation is expected in a future version of SVG. 
"The current method for accessing and modifying the attributes on the animation elements is to use the standard 
getAttribute, setAttribute, getAttributeNS and setAttributeNS defined in DOM Level 2 Core İDOM2). 
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interface SVGAnimationElement : SVGElement, 
SVGTests, 
SVGExternalResourcesRequired, 
ElementTimeControl 1 


readonly attribute SVGElement targetElement, 


Tfloat getStartTime() raises(DÜüMException), 
Tloat getCurrentTime(), 

Tloat getSimpleDuration() raises(DOMException) , 
y 





Aftributes: 


e targetElement (readonly SVGElement) 


"The element vvhich is being animated. 
Operations: 


e float getStartTime() 


Returns the begin time, in seconds, for this animation elements current interval, if it exists, regardless 
of vvhether the interval has begun yet. If there is no current interval, then a DOMException vvith code 
INVALID STATE ERR is throvvn. 


Returns 
"The start time, in seconds, of this animation element/s current interval. 


Exceptions 


ə DOMEvxception, code INVALID STATE ERR 
The animation element does not have a current interval. 


e float getCurrentTime() 


Returns the current time in seconds relative to time zero for the given time container. 


Returns 
The current time in seconds relative to time zero for the given time container. 


e float getSimpleDuration() 


Returns the number of seconds for the simple duration for this animation. If the simple duration is undefined 
(e.g., the end time is indefinite), then an exception is raised. 


c 
.o 
5 
İv) 
m") 
s 
(3) 
z 
E 
ə) 
(ə) 
o 
ad 
. 
s 


Returns 
number of seconds for the simple duration for this animation. 


Exceptions 


e DOMEvxception, code NOT. SUPPORTED ERR 
"The simple duration is not determined on the given element. 


19.4.4 Interface SVGAnimateElement 





The SVGAnimateElement interface corresponds to the “animate” element. 
Obiect-oriented access to the attributes of the “animate” element via the SVG DOM is not available. 


interface SVGAnimateElement : SVGAnimationElement, 
SVGstylable 1 
y 


19.4.5 Interface SVGSetElement 


"The SVGSetElement interface corresponds to the “set” element. 
Obiect-oriented access to the attributes of the “set” element via the SVG DOM is not available. 


interface SV6SetElement : SVGAnimationElement (f 


19.4.6 Interface SVGAnimateMotionElement 


The SVGAnimateMotionElement interface corresponds to the “animateMotion” element. 
Obiect-oriented access to the attributes of the “animateMotion” element via the SVG DOM is not available. 


interface SVGAnimateMotionElement : SVGAnimationElement 
y 


19.4.7 Interface SVGMPathElement 


The SVGMPathElement interface corresponds to the “mpath” element. 


interface SV6MPathElement : SVGElement, 
SVGURTReference, 
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SVGExternalResourcesRequired ( 


19.4.8 Interface SVGAnimateColorElement 


The SVGAnimateColorElement interface corresponds to the “animateColor” element. 
Obiect-oriented access to the attributes of the “animateColor” element via the SVG DOM is not available. 


interface SVGAnimateColorElement : SVGAnimationElement, 
SVGstylable 1 
x 


19.4.9 Interface SVGAnimateTransformElement 


The SVGAnimateTransformElement interface corresponds to the “animateTransform” element. 
Obiect-oriented access to the attributes of the “animateTransform” element via the SVG DOM is not available. 


interface SV6GAnimateTransformElement : SVGAnimationElement ( 
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20 Fonts 


Contents 


20.1 Introduction 

20.2 Overvievv of SVG fonts 

20.3 The “ont” element 

20.4 The “glyph” element 

20.5 The “missing-glyph” element 

20.6 Glyph selection rules 

20.7 The “hkern” and “vkern” elements 

20.8 Describing a font 
20.8.1 Overvievv of font descriptions 
20.8.2 Alternative vvays for providing a font description 
20.8.3 The “font-face” element 
20.8.4 The “font-face-src” element 
20.8.5 The “font-face-uri” and “font-face-format” elements 
20.8.6 The “font-face-name” element 

20.9 DOM interfaces 
20.9.1 Interface SVGFontElement 
20.9.2 Interface SVGGiyphElement 
20.9.3 Interface SVGMissingGiyphElement 
20.9.4 Interface SVGHKernElement 
20.9.5 Interface SVGVKernElement 
20.9.6 Interface SVGFontFaceElement 
20.9.7 Interface SVGFontFaceSrcElement 
20.9.8 Interface SVGFontFaceUriElement 
20.9.9 Interface SVGFontFaceFormatElement 
20.9.10 Interface SVGFontFaceNameElement 


20.1 Introduction 


Reliable delivery of fonts is a requirement for SVG. Designers need to create SVG content vvith arbitrary fonts and 
knovr that the same graphical result vvill appear vvhen the content is vievved by all end users, even vvhen end users 
do not have the necessary fonts installed on their computers. This parallels the print vvorld, vvhere the designer 
uses a given font vvhen authoring a dravving for print, and the graphical content appears exactly the same in the 
printed version as it appeared on the designer"s authoring system. 

SVG utilizes the VVebFonts facility defined in CSS2 (İCSS2), section 15.1) as a key mechanism for reliable de- 
livery of font data to end users. İn a common scenario, SVG authoring applications generate compressed, subsetted 
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VVebFonts for all text elements used by a given SVG document fragment. Typically, the VVebFonts are saved in a 
location relative to the referencing document. 

One disadvantage to the VVebFont facility to date is that specifications such as CSS2 do not require support 
of particular font formats. The result is that different implementations support different VVeb font formats, thereby 
making it difficult for VVeb site creators to post a single VVeb site using VVebFonts that vvork across all user agents. 

To provide a common font format for SVG that is guaranteed to be supported by all conforming SVG vievvers, 
SVG provides a facility to define fonts in SVG. This facility is called SVG fonts. 

SVG fonts can improve the semantic richness of graphics that represent text. For example, many company 
logos consist of the company name dravvn artistically. In some cases, accessibility may be enhanced by expressing 
the logo as a series of glyphs in an SVG font and then rendering the logo as a “text” element vvhich references this 
font. 


20.2 Overvievv of SVC fonts 


An SVG font is a font defined using SVG"s “font” element. 

The purpose of SVG fonts is to allovv for delivery of glyph outlines in display-only environments. SVG fonts 
that accompany VVeb pages must be supported only in brovvsing and vievving situations. Graphics editing applica- 
tions or file translation tools must not attempt to convert SVG fonts into system fonts. The intent is that SVG files 
be interchangeable betvveen tvvo content creators, but not the SVG fonts that might accompany these SVG files. 
Imstead, each content ereator vvill need to license the given font before being able to successfully edit the SVG file. 
"The “Tfont-face-name” element indicates the name of licensed font to use for editing. 

SVG fonts contain unhinted font outlines. Because of this, on many implementations there vvill be limitations 
regarding the quality and legibility of text in small font sizes. For increased quality and legibility in small font 
sizes, content creators may vvant to use an alternate font technology, such as fonts that ship vvith operating sys- 
tems or an alternate VVebFont format. 

Because SVG fonts are expressed using SVG elements and attributes, in some cases the SVG feont vvill take up 
more space than if the font vvere expressed in a different VVebFont format vvhich vvas especially designed for com- 
pact expression of font data. For the fastest delivery of VVeb pages, content creators may vvant to use an alternate 
font technology. 

A key value of SVG fonts is guaranteed availability in SVG user agents. İn some situations, it might be appro- 
priate for an SVG font to be the first choice for rendering some text. In other situations, the SVG font might be an 
alternate, back-up font in case the first choice font (perhaps a hinted system font) is not available to a given user. 

The characteristics and attributes of SVG fonts correspond closely to the font characteristics and parameters 
described in the Fonts chapter of the Cascading Style Sheets (CSS) level 2 specification (TCSS21, chapter 15). In this 
model, various font metrics, such as advance values and baseline İocations, and the glyph outlines themselves, are 
expressed in units that are relative to an abstract square vvhose height is the intended distance betvveen lines of 
type in the same type size. This square is called the em square and it is the design grid on vvhich the glyph out- 
lines are defined. The value of the “units-per-em” attribute on the “foni-face” element specifies hovv many units the 
em square is divided into. Common values for other font types are, for example, 250 (Intellifont), 1000 (Type 1) 
and 2048 (TrueType, TrueType GX and Open-İype). Unlike standard graphics in SVG, vvhere the initial coordinate 
system has the y-axis pointing dovvnvvard (see The initial coordinate system), the design grid for SVG fonts, along 


vvith the initial coordinate system for the gliyphs, has the y-axis pointing upvvard for consisteney vvith accepted 
industry practice for many popular font formats. 

SVG fonts and their associated gİyphs do not specify bounding box information. Because the giyph outlines 
are expressed as SVG graphics elements, the implementation has the option to render the glyphs either using 
standard graphics calls or by using special-purpose font rendering technology, in vvhich case any necessary max- 
imum bounding box and overhang calculations can be performed from analysis of the graphics elements contained 
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vvithin the giyph outlines. 
An SVG font can be either embedded vvithin the same document that uses the font or saved as part of an 


external resource. 
Here is an example of hovv you might embed an SVG font inside of an SVG document. 


e?xml versione"1.0" standalonez"yes"?z 
€svg vidth-"400px" height-"300px" versionze"1.1" 
xmlns z "http:/ /vuv.v3.o0rg/2000/svg"” 
edefs- 
efont id-"Font1" horiz-adv-x-"1000"x 
efont-face font-family-"Super Sans" font-veight-"bold" font-stylez"normal" 
units-per-em-"1000" cap-height-"600" x-height-"400" 
ascent-"700" descent-"300" 
alphabetice"0" mathematical-"350" ideographice"400" hanginge"500"- 
eTfont-fTace-src” 
efont-fTace-name namez"Super Sans Bold"/5 
se/ font-face-src” 
c/ Tont-facex 
cmissing-glypho-cpath d-"M0, 0h200v200h-200z"/x-/missing-glyph- 
eglyph unicodez"l1" horiz-adv-xz"300"5-1-- Outline of exclam. pt. glyph --s--c/glyphx 
eglyph unicodez"g"s-l-- Outline of 6 glyph ----/glyph- 
c1-- more glyphs --s 
e/ Tont” 
xc/defTss 
etext xe"100" y-"100" 
stylee"font-family: "Super Sans", Helvetica, sans-serif, 
font-veight: bold, font-style: normal"sText 
using embedded font-c/textə” 
x/ svg” 





Here is an example of hovv you might use the CSS (Əfont-face facility (1CSS21, section 15.3.1) to reference an SVG 
font vvhich is saved in an external file. First referenced SVG font file: 


e?xml versione"1.0" standalonez"yes"?s 
€svg vidth-"1005" height-"1005" version-"1.1" 
xmlns z "http://vuv.v3.o0rg/2000/svg"” 
edefs- 
cefont id-"Font2" horiz-adv-xz"1000"- 
efont-face font-family-"Super Sans" font-veight-"normal" font-stylez"italic" 
units-per-em-"1000" cap-height-"600" x-height-"400" 
ascent-"700" descent-"300" 
alphabetice"0" mathematical-"350" ideographic-"400" hanginge"500"5 
eTfont-fTace-src” 
efont-fTace-name namez"Super Sans Ttalic"/s 
e/ font-face-src” 
c/ font-facex 
cmissing-glyphsr-path d-"M0, 0h200v200h-200z"/x-/missing-glyph” 
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eglyph unicodez"1" horiz-adv-xz"300"5-1-- Outline of exclam. pt. glyph --s-c/glyphx 
eglyph unicodez"g"s-i-- Outline of 6 glyph ----c/glyph- 
c1-- more glyphs --s 
c/Tont” 
xc/defsəs 
x/ SVg” 


The SVG file vvhich uses/references the above SVG font 


e?xml versione"1.0" standalonez"yes"?s 
xsvg vidth-"400px" height-"300px" versionze"1.1" 
xmlns z "http://vuv.v3.o0rg/2000/svg"” 
xdeTsəs 
estyle typeze"text/css"əs 
el İCDATAL 
gfont-face ( 
font-family: "Super Sans", 
Tfont-veight: normal, 
font-style: italic, 
src: ur1l("myfont.svgiö”Font2") format("svg") 


l 

11: 
x/stylex 
xe/defsəs 
ctext xe"100" y-"100" 

style-"font-family: "Super Sans", font-veight:normal, 
font-style: italic"sText using referenced fontc/texts 
x/ sVvg” 


20.3 The “Tont” element 


"The “font” element defines an SVG font. 


Categories: “font” 
None 


Content model: 
Any number of the follovving elements, in any order: 
descriptive elements 
“font-face” 
“giyph” 
“hkern” 
“missing-giyph” 
“vkern” 
Attributes: 


core attributes 
presentation attributes 
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“class” 
“style” 
“externalResourcesRequired” 
“horiz-origin-x” 
“horiz-origin-y” 
“horiz-adv-x” 

vert-origin-x 

vert-origin-y 


“vert-adv-y” 


DOM Interfaces: 
SVGFontElement 


Attribute definitions: 


horiz-origin-x — "-number?”" 
"The X-coordinate in the font coordinate system of the origin of a glyph to be used vvhen dravving horizont- 
ally oriented text. (Note that the origin applies to all gİyphs in the font.) 
If the attribute is not specifted, the effect is as if a value of "0" vvere specifted. 
Animatable: no. 


horiz-origin-y — "-number”" 
The Y-coordinate in the font coordinate system of the origin of a glyph to be used vvhen dravving horizontally 
oriented text. (Note that the origin applies to all gİyphs in the font.) 
If the attribute is not specifted, the effect is as if a value of "0" vvere specifted. 
Animatable: no. 


horiz-adv-x c "-number-" 
"The default horizontal advance after rendering a gİyph in horizontal orientation. Glyph vvidths are required 
to be non-negative, even if the glyph is typically rendered right-to-left, as in Hebrevv and Arabic scripts. 
Animatable: no. 


vert-origin-x — "-number”" 
"The default X-coordinate in the font coordinate system of the origin of a gİyph to be used vvhen dravving 
vertically oriented text. 
If the attribute is not specifted, the effect is as if the attribute vvere set to half of the effective value of attribute 
“horiz-adv-x”. 


Animatable: no. 


vert-origin-y — "-number”" 
"The default Y-coordinate in the font coordinate system of the origin of a gİyph to be used vvhen dravving 
vertically oriented text. 
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If the attribute is not specifted, the effect is as if the attribute vvere set to the position specifted by the font/s 
“ascent” attribute. 
Animatable: no. 


vert-adv-y — "-number”" 
"The default vertical advance after rendering a glyph in vertical orientation. 
If the attribute is not specifted, the effect is as if a value equivalent of one em vvere specified (see “units-per- 
em”). 


Animatable: no. 


Each “font” element must have a “font-face” child element vvhich describes various characteristics of the font. 


20.4 The “giyph” element 


The “glyph” element defines the graphics for a given glyph. The coordinate system for the glyph is defined by the 
various attributes in the “font” element. 

The graphics that make up the “giyph” can be a single path data specification vvithin the “d” attribute, arbitrary 
SVG as content vrithin the “glyph”, or both. These tvvo alternatives are processed differently (see belovv). 


Categories: “glyph” 
Container element 


Content model: 

Any number of the follovving elements, in any order: 
animation elements 
descriptive elements 
shape elements 
structural elements 
gradient elements 
. 

“altGiyphDef” 
“clipPath” 
“color-profile” 
“cursor” 

“filter” 

“font” 
“font-face” 
“ToreignObiect” 
“image” 
“marker” 


“mask” 


“pattern” 
“script” 
“style” 
“svvitch” 


“text” 
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“vievv” 
Attributes: 
core attributes 
presentation attributes 
“class” 
“style” 
“” 


“horiz-adv-x” 





“vert-origin-x” 
“vert-origin-y” 
“vert-adv-y” 
“unicode” 
“glyph-name” 
“orientation” 
“arabic-form” 


“lang” 


DOM Tnterfaces: 
SVGGİiyphElement 


Attribute definitions: 


unicode — "-string”" 
One or more Unicode characters indicating the sequence of Unicode characters vvhich corresponds to this 
giyph. If a character is provided, then this glyph corresponds to the given Unicode character. If multiple char- 
acters are provided, then this glyph corresponds to the given sequence of Unicode characters. One use of a 
sequence of characters is İigatures. For example, if unicode-"fil", then the given glyph vvill be used to render 
the sequence of characters "f", "f", and "TI". 


İt is often useful to refer to characters using XML character references expressed in hexadecimal notation or 
decimal notation. For example, unicode-"İfl" could be expressed as XML character references in hexadecimal 
notation as unicode-"6z/x66:6r/x66:6ciFx6c:" or in decimal notation as unicode-"6::102:6x5102:6x/108,". 


"The “unicode” attribute contributes to the process for deciding vvhich glyphi(s) are used to represent vvhich 
character(s). See glyph selection rules. If the “unicode” attribute is not provided for a given “giyph”, then the 
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only vvay to use this giyph is via an “aliGlyph” reference. 
Animatable: no. 


glyph-name £ "-names İF, -names 1” " 
A name for the glyph. İt is recommended that glyph names be unique vvithin a font. The glyph names can 
be used in situations vvhere Unicode character numbers do not provide suflicient information to access the 
correct glyph, such as vvhen there are multiple giyphs per Unicode character. The giyph names can be refer- 
enced in kerning definitions. 
Animatable: no. 


d — "path data" 
"The definition of the outline of a glyph, using the same syntax as for the “d” attribute on a “path” element. See 
Path data. 
See belovv for a discussion of this attribute. 
Animatable: no. 


orientation - "hlv" 
Imndicates that the given gİyph is only to be used for a particular inline-progression-direction (i.e., horizontal 
or vertical). If the attribute is not specifted, then the gİyph can be used in all cases (i.e., both horizontal and 
vertical inline-progression-direction). 
Animatable: no. 


arabic-form - "initial / medial İ terminal İ isolated" 
For Arabic glyphs, indicates vvhich of the four possible forms this glyph represents. 
Animatable: no. 


Tang - "Z.LanguageCodes," 
"The attribute value is a comma-separated list of language names as defined in BCP 47 İBCPA7)1. The giyph 
can be used if the “xml:lang” attribute exactly matches one of the languages given in the value of this para- 
meter, or if the “xml:lang” attribute exactly equals a prefix of one of the languages given in the value of this 


parameter such that the first tag character follovving the prefix is "-". 
Animatable: no. 


horiz-adv-x - "-number-" 
"The horizontal advance after rendering the glyph in horizontal orientation. If the attribute is not specifted, 
the effect is as if the attribute vvere set to the value of the font"s “horiz-adv-x” attribute. 
Glyph vvidths are required to be non-negative, even if the glyph is typically rendered right-to-left, as in 
Hebrevr and Arabic scripts. 
Animatable: no. 


vert-origin-x — "-number”" 
"The X-coordinate in the font coordinate system of the origin of the giyph to be used vvhen dravving vertically 
oriented text. 
If the attribute is not specifted, the effect is as if the attribute vvere set to the value of the font"s “vert-origin-x” 
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attribute. 
Animatable: no. 


vert-origin-y — "-number”" 
"The Y-coordinate in the font coordinate system of the origin of a gİyph to be used vvhen dravving vertically 
oriented text. 
If the attribute is not specifted, the effect is as if the attribute vvere set to the value of the font"s “vert-origin-y” 
attribute. 
Animatable: no. 


vert-adv-y — "-number”" 
"The vertical advance after rendering a glyph in vertical orientation. 
If the attribute is not specifted, the effect is as if the attribute vvere set to the value of the font"s “vert-adv-y” 
attribute. 
Animatable: no. 


"The graphics for the “giyph” can be specifted using either the “d” attribute or arbitrary SVG as content vvithin the 


“glyph”. 
If the “d” attribute is specifted, then the path data vvithin this attribute is processed as follovvs: 


e Any relative coordinates vvithin the path data specification are converted into equivalent absolute coordin- 
ates 

ə Each of these absolute coordinates is transformed from the font coordinate system into the “text” elements 
current coordinate system such that the origin of the font coordinate system is properly positioned and ro- 
tated to align vvith the current text position and orientation for the giyph, and scaled so that the correct “font- 
size” is achieved. 

e "The resulting, transformed path specification is rendered as if it vvere a “patl” element, using the styling prop- 
erties that apply to the characters vvhich correspond to the given gliyph, and ignoring any styling properties 
specifted on the “font” element or the “glyph” element. 


If the “giyph” has child elements, then those child elements are rendered in a manner similar to hovv the “use” ele- 
ment renders a referenced symbol. The rendering effect is as if the contents of the referenced “glyph” element vvere 
deeply cloned into a separate non-exposed DOM tree. Because the cloned DOM tree is non-exposed, the SVG 
DOM does not shovv the cloned instance. 

For user agents that support Styling vvith CSS, the conceptual deep cloning of the referenced “glyph” element 
into a non-exposed DOM tree also copies any property values resulting from the CSS cascade (İCSS2İ, chapter 
6) on the referenced “glyph” and its contents, and also applies any property values on the “font” element. CSS2 
selectors can be applied to the original (i.e., referenced) elements because they are part of the formal document 
structure. CSS2 selectors cannot be applied to the (conceptually) cloned DOM tree because its contents are not part 
of the formal document structure. 

Property inheritance, hovvever, vvorks as if the referenced “giyph” had been textually included as a deeply 
cloned child vvithin the document tree. The referenced “glyph” inherits properties from the element that contains 
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the characters that correspond to the “glyph”. The “glyph” does not inherit properties from the “font” elements ori- 
ginal parents. 

In the generated content, for each instance of a given “glyph”, a “g” is created vvhich carries vvith it all property 
values resulting from the CSS cascade on the “font” element for the referenced “glyph”. VVithin this “g” is another 
“g” vyhich carries vvith it all property values resulting from the CSS cascade on the “glyph” element. The original 
contents of the “giyph” element are deep-cloned vvithin the inner “g” element. 

If the “glyph” has both a “d” attribute and child elemenis, the “d” attribute is rendered first, and then the child 
elements. 

m general, the “d” attribute renders in the same manner as system fonts. For example, a dashed pattern vvill 
usually look the same if applied to a system font or to an SVG font vvhich defines its glyphs using the “d” attribute. 
Many implementations vvill be able to render glyphs defined vvith the “d” attribute quickly and vvill be able to use 
a font cache for further performance gains. 

Defining a giyph by including child elements vvithin the “glyph” gives greater flexibility but more complexity. 
Different fill and stroke techniques can be used on different parts of the glyphs. For example, the base of an "i" 
could be red, and the dot could be blue. This approach has an inherent complexity vvith units. Any properties spe- 
cifled on a text elements vvhich represents a length, such as the “stroke-vvidih” property, might produce surprising 
results since the length value vvill be processed in the coordinate system of the gİyph. 


20.5 The “missing-giyph” element 


"The “missing-glyph” element defines the graphics to use if there is an attempt to dravv a gİyph from a given font 
and the given glyph has not been defined. The attributes on the “missing-giyph” element have the same meaning as 
the corresponding attributes on the “elyph” element. 


Categories: “missing-giyph” 
Container element 
Content model: 
Any number of the follovving elements, in any order: 
animation elements 
descriptive elements 
shape elements 
structural elements 
gradient elements 
. 
“altGiyphDef” 
“clipPath” 
“color-profile” 
“cursor” 
“filter” 


“font” 
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“font-face” 
“ToreignObiect” 
“image” 
“marker” 
“mask” 
“pattern” 
“script” 
“style” 
“svvitch” 
“text” 
“vievv” 
Attributes: 
core attributes 
presentation attributes 
“class” 
“style” 
“” 
“horiz-adv-x” 
“vert-origin-x” 
“vert-origin-y” 


“vert-adv-y” 


DOM Tnterfaces: 
SVGMissingGiyphElement 


20.6 Giyph selection rules 


VVhen determining the glyph(s) to dravv a given character sequence, the “font” element is searched from its first 
“giyph” element to its last in logical order to see if the upcoming sequence of Unicode characters to be rendered 
matches the sequence of Unicode characters specifted in the “unicode” attribute for the given “glyph” element. The 
first successful match is used. Thus, the "İfl" İigature needs to be defined in the font before the "f" giyph: othervvise, 
the "ffl" vvill never be selected. 

Note that any occurrences of “altGlyph” take precedence over the above gliyph selection rules vvithin an SVG 


font. 


20.7 The “hkern” and “vkern” elements 


The “hkern” and “vkern” elements define kerning pairs for horizontally-oriented and vertically-oriented pairs of 


glyphs, respectively. 
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Kern pairs identify pairs of glyphs vvithin a single font vvhose inter-giyph spacing is adiusted vvhen the pair 
of gİyphs are rendered next to each other. In addition to the requirement that the pair of glyphs are from the same 
font, SVG font kerning happens only vvhen the tvvo gİyphs correspond to characters vvhich have the same values 
for properties “font-family”, “Tont-size”, “font-style”, “font-vveight”, “font-variant”, Tfont-stretch”, “font-size-adiust” and 
“font”. 

An example of a kerning pair are the letters "Va", vrhere the typographic result might look better if the letters 
"V" and the "a" vvere rendered slightly closer together. 

Right-to-left and bidirectional text in SVG is laid out in a tvvo-step process, vvhich is described in Relationship 
vvith bidirectionality. If SVG fonts are used, before kerning is applied, characters are re-ordered into left-to-right 
(or top-to-bottom, for vertical text) visual rendering order. Kerning from SVG fonts is then applied on pairs of 
giyphs vvhich are rendered contiguously. The first giyph in the kerning pair is the left (or top) glyph in visual ren- 
dering order. The second giyph in the kerning pair is the right (or bottom) giyph in the pair. 

For convenience to font designers and to minimize file sizes, a single “hkern” and “vkern” can define a single 
kerning adiustment value betvveen one set of glyphs (e.g., a range of Unicode characters) and another set of glyphs 
(e.g., another range of Unicode characters). 

The “hkern” element defines kerning pairs and adiustment values in the horizontal advance value vvhen dravv- 
ing pairs of gİyphs vvhich the tvvo gİyphs are contiguous and are both rendered horizontally (i.e., side-by-side). 
"The spacing betvveen characters is reduced by the kerning adiustment. (Negative kerning adiustments increase the 
spacing betvveen characters.) 

The “vkern” element defines kerning pairs and adiustment values in the vertical advance value vvhen dravving 
pairs of glyphs together vrhen stacked vertically. The spacing betvveen characters is reduced by the kerning adifust- 
ment. 


Categories: “hkern” 
None 


Content model: 
Empty. 


Attributes: 
core attributes 


“a 


DOM Tnterfaces: 
SVGHKernElement 


“vkern” 


Categories: 
None 


Content model: 
Empty. 
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Attributes: 
core attributes 





DOM Tnterfaces: 
SVGVKernElement 


Attribute definitions: 

u1 — "İ-character-- İ curange”- 1 L İ-character-- İ curange:-1 1” " 

A sequence (comma-separated) of Unicode characters (refer to the description of the “unicode” attribute to the 
“glyph” element for a description of hovv to express individual Unicode characters) and/or ranges of Unicode 
characters (see description of ranges of Unicode characters in CSS2, TCSS2), section 15.3.3) vvhich identify a 
set of possible first giyphs in the kerning pair. If a given Unicode character vvithin the set has multiple corres- 
ponding “giyph” elements (i.e., there are multiple “giyph” elements vvith the same “unicode” attribute value, but 
different glyph-name” values), then all such glyphs are included in the set. Comma is the separator character, 
thus, to kern a comma, specify the comma as part of a range of Unicode characters or as a gİyph name using 
the “gr” attribute. The total set of possible first glyphs in the kerning pair is the union of glyphs specifted by 
the “u1” and “gr” attributes. 

Animatable: no. 


g1 - "-names İF, -name- 1” " 
A sequence (comma-separated) of giyph names (i.e., values that match “glyph-name” attributes on “giyph” ele- 
ments) vvhich identify a set of possible first glyphs in the kerning pair. AII glyphs vvith the given giyph name 
are included in the set. The total set of possible first glyphs in the kerning pair is the union of gİyphs specifted 
by the “ur” and “gr” attributes. 
Animatable: no. 


x" 


u2 — "F-character”- / curange”l L FE-character”- İ curange-1 1 
Same as the “ur” attribute, except that “u2” specifies possible second glİyphs in the kerning pair. 
Animatable: no. 
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x" 


g2 — "-names İF, -names 1 
Same as the “gr” attribute, except that “g2” specifies possible second giyphs in the kerning pair. 
Animatable: no. 


k — "-number-" 
"The amount to decrease the spacing betvveen the tvvo giyphs in the kerning pair. The value is in the font 
coordinate system. This attribute is required. 
Animatable: no. 


At least one each of “u1” or “g1” and at least one of “u2” or “g2” must be provided. 


20.8 Describing a font 


20.8.1 Overvlievv of font descriptions 


A font description provides the bridge betvveen an author s font specification and the font data, vvhich is the data 
needed to format text and to render the abstract glyphs to vvhich the characters map — the actual scalable outlines 
or bitmaps. Fonts are referenced by properties, such as the “font-family” property. 

Each specifled font description is added to the font database and so that it can be used to select the relevant 
font data. The font description contains descriptors such as the location of the font data on the VVeb, and charac- 
terizations of that font data. The font descriptors are also needed to match the font properties to particular font 
data. The level of detail of a font description can vary from fust the name of the font up to a list of glyph vvidths. 

For more about font descriptions, refer to the Fonts chapter in the CSS2 specification (TCSS2l, chapter 15). 


20.8.2 Alternative vvays for providing a font description 
Font deseriptions can be specifted in either of the follovving vvays: 


e a “font-face” element 
e an (font-face rule (TCSS2l, section 15.3.1) vvithin a CSS style sheet (only applicable for user agents vvhich 
support using CSS to style the SVG content) 


20.8.3 The “ont-face” element 


The “Tont-face” element corresponds directly to the (Əfont-face facility in CSS2 (TCSS2), section 15.3.1). It can be 
used to describe the characteristics of any font, SVG font or othervvise. 

VVhen used to describe the characteristics of an SVG font contained vvithin the same document, it is recom- 
mended that the “Tont-face” element be a child of the “font” element it is describing so that the “font” element can 
be self-contained and fully-deseribed. In this case, any “font-face-src” elements vvithin the “font-face” element are 
ignored as it is assumed that the “font-face” element is describing the characteristics of its parent “font” element. 


Categories: “font-face” 
None 


Content model: 
Any number of descriptive elements and at most one “Tont-face-src” element, in any order. 
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Attributes: 
core attributes 
“font-family” 
“font-style” 
“font-variant” 
“font-vveight” 


“font-stretch” 





“font-size” 
“unicode-range” 
“units-per-em” 
“panose-1” 

“stemv” 

“stemh” 

“slope” 

“cap-height” 
“x-height” 
“accent-height” 
“ascent” 

“descent” 

“vvidths” 

“bbox” 

“ideographic” 
“alphabetic” 
“mathematical” 
“hanging” 
“v-ideographic” 
“v-alphabetic” 
“v-mathematical” 
“v-hanging” 
“underline-position” 
“underline-thickness” 
“strikethrough-position” 
“strikethrough-thickness” 
“overline-position” 


“overline-thickness” 
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DOM Tnterfaces: 
SVGFontFaceElement 


Attribute definitions: 


font-family — "-string-" 
Same syntax and semantics as the “font-family” deseriptor vvithin an (Əfont-face rule. 


Animatable: no. 


x" 


font-style - "all İ f normal İ italic / obliquel L İnormal 1 italic 1 obliquell 
Same syntax and semantics as the “font-style” descriptor vvithin an (Əfont-face rule. The style of a font. Takes 
on the same values as the “font-style” property, except that a comma-separated list is permitted. 
If the attribute is not specifted, the effect is as if a value of "all" vvere specifted. 


Animatable: no. 


Tfont-variant — "İnormal İl small-caps) Lİnormal İ small-caps1l1”" 
Same syntax and semantics as the “font-variant” descriptor vvithin an (Əfont-face rule. İndication of vvhether 
this face is the small-caps variant of a font. Takes on the same values as the “font-variant” property, except 
that a comma-separated list is permitted. 
If the attribute is not specifted, the effect is as if a value of "normal vvere specifled. 


Animatable: no. 


font-veight - "all I Inormal İ bold I 100 200 / 300 1 400 İ 500 1 600 İ 700 1 800 1 9001 I, İnormal İ bold 1 100 1 200 / 300 1 400 
1500 1 600 1 700 800 1 900117" 

Same syntax and semantics as the “font-vveight” descriptor vvithin an (font-face rule. 

"The vveight of a face relative to others in the same font family. Takes on the same values as the “font-vveight” 


property vvith three exceptions: 


ə relative keyvvords (bolder, lighter) are not permitted 

ə a comma-separated list of values is permitted, for fonts that contain multiple vveights 

e an additional keyvvord, "all", is permitted, vvhich means that the font vvill match for all possible vveights, 
either because it contains multiple vveights, or because that face only has a single vveight. 


If the attribute is not specifted, the effect is as if a value of "all" vvere specifted. 
Animatable: no. 


font-stretch — "all 1 T normal İl ultra-condensed İl extra-condensed 1 condensed İl semi-condensed l semi-expanded İl 
expanded İ extra-expanded İ ultra-expandedl) T, T normal 1 ultra-condensed İl extra-condensed İl condensed 1 semi-con- 


densed İ semi-expanded İl expanded l extra-expanded l ultra-expandedl 1 
Same syntax and semantics as the “font-streteh” descriptor vvithin an (öfont-face rule. Indication of the con- 
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densed or expanded nature of the face relative to others in the same font family. Takes on the same values 
as the “font-streteh” property except that: 


e relative keyvvords (vvider, narrovver) are not permitted 
e a comma-separated list is permitted 
e the keyvvord "all" is permitted 


If the attribute is not specifted, the effect is as if a value of "normal" vvere specifted. 


Animatable: no. 


font-size — "-string”" 
Same syntax and semantics as the “font-size” descriptor vvithin an (öfont-face rule. 


Animatable: no. 


unicode- range - "-uranges İL curange”l1”" 
Same syntax and semantics as the “unicode-range” descriptor vvithin an (Əfont-face rule. The range of 15O 
10646 characters İUNICODEİ possibly covered by the giyphs in the font. Except for any additional informa- 
tion provided in this specification, the normative definition of the attribute is in CSS2 (TCSS2), section 15.3.3). 
If the attribute is not specifted, the effect is as if a value of "U-0-10FFFF" vvere specifted. 
Animatable: no. 


units-per-em — "-number”" 
Same syntax and semantics as the “units-per-em” descriptor vvithin an (Əfont-face rule. The number of co- 
ordinate units on the em square, the size of the design grid on vvhich glyphs are laid out. 
"This value is almost alvvays necessary as nearly every other attribute requires the definition of a design grid. 
If the attribute is not specifted, the effect is as if a value of "1000" vvere specifted. 


Animatable: no. 


panose-1 -— "İI-integer”1110)" 
Same syntax and semantics as the “panose-1” descriptor vvithin an (öfont-face rule. The Panose-1 number, 
consisting of ten decimal integers, separated by vvhitespace. Except for any additional information provided 
in this specification, the normative definition of the attribute is in CSS2 (TCSS2), section 15.3.6). 
If the attribute is not specifted, the effect is as if a value of "0 0 0 0 0 0 0 0 0 0" vvere specifted. 
Animatable: no. 


stemv — "-number-" 
Same syntax and semantics as the “stemv” descriptor vvithin an (Əfont-face rule. 


Animatable: no. 


stemh — "-number-" 
Same syntax and semantics as the “stemh” descriptor vvithin an (Əfont-face rule. 
Animatable: no. 
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slope — "-numbers" 
Same syntax and semantics as the “slope” descriptor vvithin an (öfont-face rule. The vertical stroke angle of 
the font. Except for any additional information provided in this specification, the normative definition of the 
attribute is in CSS2 (TCSS2İ, section 15.3.6). 
If the attribute is not specifted, the effect is as if a value of "0" vvere specifted. 


Animatable: no. 


cap-height — "-number”" 
Same syntax and semantics as the “cap-height” descriptor vvithin an (Əfont-face rule. The height of uppercase 
giyphs in the font vvithin the font coordinate system. 
Animatable: no. 


x-height — "-number?" 
Same syntax and semantics as the “x-height” descriptor vvithin an (Əfont-face rule. The height of lovvercase 
giyphs in the font vvithin the font coordinate system. 
Animatable: no. 


accent-height — "-number”" 
"The distance from the origin to the top of accent characters, measured by a distance vvithin the font coordin- 
ate system. 
If the attribute is not specifted, the effect is as if the attribute vvere set to the value of the “ascent” attribute. 


Animatable: no. 


ascent — "-numbers" 
Same syntax and semantics as the “ascent” descriptor vvithin an (Əfont-face rule. The maximum unaccented 
height of the font vvithin the font coordinate system. 
If the attribute is not specifted, the effect is as if the attribute vvere set to the difference betvveen the “units- 
per-em” value and the “vert-origin-y” value for the corresponding font. 
Animatable: no. 


descent - "-number”" 
Same syntax and semantics as the “descent” descriptor vvithin an (Əfont-face rule. The maximum unaccented 
depth of the font vvithin the font coordinate system. 
If the attribute is not specifted, the effect is as if the attribute vvere set to the “vert-origin-y” value for the 
corresponding font. 
Animatable: no. 


vidths — "-string”" 
Same syntax and semantics as the “vridihs” descriptor vvithin an (Əfont-face rule. 
Animatable: no. 


bbox £ "-string”" 
Same syntax and semantics as the “bbox” descriptor vvithin an (Əfont-face rule. 


Animatable: no. 
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ideographic — "-number-" 
For horizontally oriented glyph layouts, indicates the alignment coordinate for glyphs to achieve ideographic 
baseline alignment. The value is an offset in the font coordinate system. 
Animatable: no. 


alphabetic — "-number”" 
Same syntax and semantics as the “baseline” descriptor vvithin an (Əfont-face rule. For horizontally oriented 
giyph layouts, indicates the alignment coordinate for glyphs to achieve alphabetic baseline alignment. The 
value is an offset in the font coordinate system. 
Animatable: no. 


mathematical - "-number-" 
Same syntax and semantics as the “mathline” descriptor vvithin an (Əfont-face rule. For horizontally oriented 
giyph layouts, indicates the alignment coordinate for gİyphs to achieve mathematical baseline alignment. 
"The value is an offset in the font coordinate system. 
Animatable: no. 


hanging - "-number-" 
For horizontally oriented glyph layouts, indicates the alignment coordinate for glyphs to achieve hanging 
baseline alignment. The value is an offset in the font coordinate system. 
Animatable: no. 


v-ideographic — "-numbers" 
For vertically oriented glyph layouts, indicates the alignment coordinate for glyphs to achieve ideographic 
baseline alignment. The value is an offset in the font coordinate system relative to the giyph-specific “vert- 
origin-x” attribute. 
Animatable: no. 


v-alphabetic — "-number?" 
For vertically oriented glyph layouts, indicates the alignment coordinate for glyphs to achieve alphabetic 
baseline alignment. The value is an offset in the font coordinate system relative to the giyph-specific “vert- 
origin-x” attribute. 
Animatable: no. 


v-mathematical - "-number-" 
For vertically oriented giyph layouts, indicates the alignment coordinate for glyphs to achieve mathematical 
baseline alignment. The value is an offset in the font coordinate system relative to the giyph-specific “vert- 
origin-x” attribute. 
Animatable: no. 


v-hanging — "-numbers" 
For vertically oriented glyph layouts, indicates the alignment coordinate for gİyphs to achieve hanging 
baseline alignment. The value is an offset in the font coordinate system relative to the giyph-specific “vert- 


origin-x” attribute. 
Animatable: no. 


underline-position — "-numbers" 
"The ideal position of an underline vvithin the font coordinate system. 
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Animatable: no. 


underline-thickness — "-numbers?" 
"The ideal thickness of an underline, expressed as a length vvithin the font coordinate system. 


Animatable: no. 


strikethrough-position — "-numbers" 
"The ideal position of a strike-through vvithin the font coordinate system. 
Animatable: no. 





strikethrough-thickness — "-numbers" 
"The ideal thickness of a strike-through, expressed as a length vvithin the font coordinate system. 
Animatable: no. 


overline-position — "-numbers" 
"The ideal position of an overline vvithin the font coordinate system. 
Animatable: no. 


overline-thickness £ "-numbers?" 
"The ideal thickness of an overline, expressed as a length vvithin the font coordinate system. 
Animatable: no. 


"The follovving elements and attributes correspond to the “src” descriptor vvithin an (Əfont-face rule. (Refer to the 
descriptions of the (Əfont-face rule and "src" descriptor in the CSS2 specification (TCSS2), sections 15.3.1 and 15.3.5.) 


20.8.4 The “Tont-face-src” element 


The “font-face-src” element, together vvith the “Tont-face-uri” and “font-face-format” elements deseribed in the fol- 
lovring sections, correspond to the “src” descriptor vvithin an (Əfont-face rule. (Refer to the descriptions of the 
(öfont-face rule and "src" descriptor in the CSS2 specification (TCSS2), sections 15.3.1 and 15.3.5). 

A “Tont-face-src” element contains “font-face-uri” and “font-face-name” elements, vvhich are used for referencing 


external and local fonts, respectively. 


Categories: “font-face-src” 
None 


Content model: 
One or more of the follovving elements, in any order: 


“font-face-name” 


“font-face-uri” 


Attributes: 
core attributes 
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DOM Tnterfaces: 
SVGFontFaceSrcElement 


20.8.5 The “font-face-uri” and “font-face-format” elements 


"The “font-face-uri” element is used vvithin a “font-face-src” element to reference a font defined inside or outside of 





the current SVG document. 
VVhen a “font-face-uri” is referencing an SVG font, then that reference must be to an SVG “Tfont” element, there- 


fore requiring the use of a fragment identifter (RFC3986). The referenced “font” element can be local (i.e., vvithin 
the same document as the “font-face-uri” element) or remote (i.e., vvithin a different document). 


Categories: “Tont-face-uri” 
None 


Content model: 
Any number of the follovving elements, in any order: 


“font-face-format” 


Attributes: 
core attributes 
xlink attributes 
“xlink:href” 


DOM Tnterfaces: 
SVGFontFaceÜUriElement 


Attribute definitions: 


xlink:href — "-IRI-" 
"The “xlink-href” attribute speciftes the location of the referenced font. 
Animatable: no. 


Child “Tont-face-format” elements of a “font-face-uri” element are used to specify the supported formats of the font 
referenced by that “font-face-uri” element. They correspond to entries in a format(...) clause of the “src” deseriptor 


in an (font-face rule. 
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Categories: “font-face-format” 


None 


Content model: 
Empty. 
Attributes: 
core attributes 
“string” 
DOM Tnterfaces: 
SVGFontFaceFormatElement 


Attribute definitions: 


string — "-anything”" 
"The “string” attribute is a hint to the user agent, and speciftes a list of formats that the font referenced by 
the parent “font-face-uri” element supports. The syntax of the attribute value is a format string as defined in 
CSS2, such as "truetype". Refer to the description of the "src" descriptor in CSS2 for details on hovv the format 
hint is interpreted (İCSS2), section 15.3.5). 
Animatable: no. 


20.8.6 The “font-face-name” element 


"The “Tont-face-name” element is used vvithin a “font-face-src” element to reference a İlocal font by name. İt corres- 
ponds to a local(...) clause in an (Əfont-face rule “src” descriptor. 


Categories: “Tfont-face-name” 
None 

Content model: 
Empty. 


Aftributes: 
core attributes 


ğ , 
name 


DOM Tnterfaces: 
SVGFontFaceNameElement 


Attribute definitions: 


name — "-anything”" 
"The “name” attribute specifies the name of a local font. Unlike the syntax allovved betvveen the parentheses 
of the local(...) clause in an (font-face rule “src” descriptor, the font name specifted in this attribute is not 
surrounded in single or double quotes. Refer to the description of the "src" deseriptor in CSS2 for details on 
hovv the font name is interpreted (İCSS2), section 15.3.5). 
Animatable: no. 
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20.9 DOM interfaces 


20.9.1 Interface SVGFontElement 





The SVGFontElement interface corresponds to the “font” element. 
Obiect-oriented access to the attributes of the “font” element via the SVG DOM is not available. 


interface SV6FontElement : SVGElement, 
SVGExternalResourcesRequired, 
SVöstylable 1 

y 


20.9.2 Interface SVGGiyphElement 


The SVGGliyphElement interface corresponds to the “glyph” element. 
Obiect-oriented access to the attributes of the “giyph” element via the SVG DOM is not available. 


interface SVGGlyphElement : SVGElement, 
SVöstylable f 
y 


20.9.3 Interface SVGMissingGiyphElement 


The SVGMissingGiyphElement interface corresponds to the “missing-glyph” element. 
Obiect-oriented access to the attributes of the “missing-giyph” element via the SVG DOM is not available. 


interface SV6MissingGlyphElement : SVGElement, 
SVGStylable 1 
y 


20.9.4 Interface SVGHKernElement 


The SVGHKernElement interface corresponds to the “hkern” element. 
Obiect-oriented access to the attributes of the “hkern” element via the SVG DOM is not available. 


interface SV6HKernElement : SVGElement 1 


20.9.5 Interface SVGVKernElement 
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The SVGVKernElement interface corresponds to the “vkern” element. 
Obiect-oriented access to the attributes of the “vkern” element via the SVG DOM is not available. 


interface SV6VKernElement : SVGElement 1 


20.9.6 Interface SVGFontFaceElement 





The SVGFontFaceElement interface corresponds to the “font-face” element. 
Obiect-oriented access to the attributes of the “font-face” element via the SVG DOM is not available. 


interface SV6FontFaceElement : SVGElement f 


20.9.7 Interface SVGFontFaceSrcElement 


The SVGFontFaceSrcElement interface corresponds to the “font-face-src” element. 
Obiect-oriented access to the attributes of the “font-face-src” element via the SVG DOM is not available. 


interface SV6FontFaceSrcElement : SVGElement 1 


20.9.8 Interface SVGFontFaceUriElement 


The SVGFontFaceÜriElement interface corresponds to the “font-face-uri” element. 
Obiect-oriented access to the attributes of the “font-face-uri” element via the SVG DOM is not available. 


interface SV6FontFaceUriElement : SVGElement 1 


20.9.9 Interface SVGFontFaceFormatElement 


The SVGFontFaceFormatElement interface corresponds to the “font-face-format” element. 
Obiect-oriented access to the attributes of the “font-face-format” element via the SVG DOM is not available. 


interface SV6FontFaceFormatElement : SVGElement f 


20.9.10 Interface SVGFontFaceNameElement 


The SVGFontFaceNameElement interface corresponds to the “font-face-name” element. 
Obiect-oriented access to the attributes of the “font-face-name” element via the SVG DOM is not available. 
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interface SV6FontFaceNameElement : SVGElement (f 
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21 Metadata 


Contents 


21.1 Introduction 
21.2 The “metadata” element 
21.3 An example 
21.4 DOM interfaces 
21.4.1 Interface SVGMetadataElement 


21.1 Introduction 


Metadata is structured data about data. 

In the computing industry, there are ongoing standardization efforts tovvards metadata vvith the goal of pro- 
moting industry interoperability and efficieney. Content creators should track these developments and include ap- 
propriate metadata in their SVG content vvhich conforms to these various metadata standards as they emerge. 

The VV3C has a Semantic VVeb Activity vvhich has been established to serve a leadership role, in both the 
design of enabling specifications and the open, collaborative development of technologies that support the automa- 
tion, integration and reuse of data across various applications. The Semantic VVeb Activity builds upon the earlier 
VV3C Metadata Activity, including the definition of Resource Description Framevvork (RDF). The RDF Primer is 
the first in a set of six documents that define the Resource Description Framevvork İRDF-PRIMERİ. 

Another activity relevant to most applications of metadata is the Dublin Core İDCOREİ, vhich is a set of 
generally applicable core metadata properties (e.g., Title, Creator/ Author, Subiect, Description, etc.). 

Imdividual industries or individual content creators are free to define their ovvn metadata schema but are en- 
couraged to follovv existing metadata standards and use standard metadata schema vvherever possible to promote 
interchange and interoperability. If a particular standard metadata schema does not meet your needs, then it is 
usually better to define an additional metadata schema in an existing framevvork such as RDF and to use custom 
metadata schema in combination vvith standard metadata schema, rather than totally ignore the standard schema. 


21.2 The “metadata” element 


Metadata vvhich is included vvith SVG content should be specified vvithin “metadata” elements. The contents of the 
“metadata” should be elements from other XML namespaces, vvith these elements from these namespaces expressed 
in a manner conforming vvith the Namespaces in XML Recommendation İXML-NSI. 

Authors should provide a “metadata” child element to the outermost svg element vvithin a stand-alone SVG 
document. The “metadata” child element to an “svg” element serves the purposes of identifying document-level 
metadata. 

The DTD definitions of many of SVGss elements (particularly, container and text elements) place no restric- 
tion on the placement or number of the “metadata” sub-elemenits. This flexibility is only present so that there vvill be 


a consistent content model for container elements, because some container elements in SVG allovv for mixed con- 
tent, and because the mixed content rules for XML (fXML10), section 3.2.2) do not permit the desired restrictions. 
Representations of future versions of the SVG language might use more expressive representations than DTDs 
vvhich allovv for more restrictive mixed content rules. İt is strongly recommended that at most one “metadata” ele- 
ment appear as a child of any particular element, and that this element appear before any other child elements 
(except possibly “desc” or “title” elements) or character data content. If metadata-processing user agents need to 
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choose among multiple “metadata” elements for processing it should choose the first one. 


Categories: “metadata” 
Descriptive element 


Content model: 
Any elements or character data. 





Attributes: 
core attributes 


DOM Interfaces: 
SVGMetadataElement 


21.3 An example 


Here is an example of hovv metadata can be included in an SVG document. The example uses the Dublin Core 
version 1.1 schema. (Other XML-compatible metadata languages, including ones not based on RDF, can be used 


also.) 


e?xml versione"1.0" standalonez"yes"?s 
€svg vidth-"4in" height-"3in" version-"1.1" 
xmlns z "http://vuv.v/3.org/2000/svg"” 
edesc xmlns:myfooz"http://exampLe .org/myfoo"z 
emyfoo:titlesThis is a financial reportc/myfoo:titles 
emyfoo:descroThe global description uses markup from the 
emyfToo :emphxmyToo-/myfoo : emph”r namespace .c/myToo:descrx” 
emyToo:scenex-cmyfoo:vhat-vidget $grovth-/myfToo:vhats 
emyfoo:containsx$three $graph-bar-c/myfoo:contains” 
emyToo :vhenx1998 $through 2000-/myfoo:vhens -c/myToo:scenes 
xc/ desc” 
cmetadataxz 
erdf:RDF 
xmlns:rdf z "http://uvv.v3.org/1999/02/22 - rdf-syntax-nsir" 
xmlns: rdfs z "http://uuv.v3.org/2000/01/ rdf -schemaz"" 
xmlns:dc z "http://pur1.org/dc/elements/1.1/" s 
erdf:Description aboute"http://example .org/myfToo" 
dc:titleze"MyFoo Financial Report" 
dc:description-"$three $bar $thousands $dollars $from 1998 $through 2000" 
dc:publisherz"Example Organization" 
dc:datez"2000-04-11" 
dc:format-"image/svg-xml" 
dc:languagez"en" s 


edc:creator” 
erdf:Bag” 
erdf:lisIrving Bird-/rdf:lis 
erdf:lisMary Lambertc/rdf:lis 
c/ rdf:Bag” 
se/dc:creatorx 
c/rdf:Descriptions 
c/ rdf:RDF” 
c/metadatax 
x/ svg” 
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21.4 DOM interfaces 


21.4.1 Interface SVGMetadataElement 





The SVGMetadataElement interface corresponds to the “metadata” element. 


interface SV6MetadataElement : SVGElement £ 


22 Backvvards Compatibility 


A user agent (UA) might not have the ability to process and vievv SVG content. The follovving list outlines tvvo of 
the backvvards compatibility scenarios associated vvith SVG content: 
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e For XML grammars vvith the ability to embed SVG content, it is assumed that some sort of alternate rep- 
resentation capability such as the “svvitch” element and some sort of feature-availability test facility (such as 
vvhat is described in the SMIL 3.0 specification İSMIL)) vrill be available. 

"This “svvitch” element and feature-availability test facility (or their equivalents) are the recommended 
vvay for XML authors to provide an alternate representation to SVG content, such as an image or a text string. 
The follovving example shovvs hovv to embed an SVG dravving vvithin a SMIL 1.0 document such that an al- 
ternate image vvill display in the event the user agent doesn"t support SVG. Note that the MIME type in the 
“type” attribute is an important means for the user agent to decide if it can decode the referenced media. 

m this example, the SVG content is included via a URL reference. VVith some parent XML grammars it 
vvill also be possible to include an SVG document fragment inline vvithin the same file as its parent grammar. 





c?xml versione"1.0" standalonez"yes"?s 
csmils 
xbody” 
c1-- Mith SMIL 1.0, the first child element of "svitch" 
vhich the SMIL 1.0 user agent is able to process 
and vhich tests true vill get processed and all other 
child elements vill have no visual effect. In this case, 
if the SMIL 1.0 user agent can process "image/svg-xml", 
then the SVG vill appear, othervise, the alternate image 
(the second child element) vill appear. --” 
€svitch” 
c1-- Render the SVG if possible, --” 
xref typeze"image/svgrxml" srce"draving.svg" /s 


c1-- Else, render the alternate image. --x 
ximg srce"alternate image.İpg" /” 
c/suvitchə” 
c/ body” 
c/smils 


e For HTML 4, SVG dravvings can be embedded using the “obiect” element. An alternate representation such 
as an image can be included as the content of the “ob/ect” element. In this case, the SVG content usually vvill 
be included via a URL reference. The follovving example shovvs hovv to use the “obiect” element to include an 
SVG dravving via a URL reference vvith an image serving as the alternate representation in the absence of an 
SVG user agent: 


ehtmls 
xbody” 
xobiect typeze"image/svgixml" dataz"draving.svg"” 
x1-- The contents of the "obiect" element (i.e., an alternate 
image) are dravn in the event the user agent cannot process 
the SVG draving. --x 
ximg srce"alternate image.İpg" alt-"alternate description" 
x/obiect- 


c/ body” 
e/ html 





uonepuəululo?oəy ƏO£AA 
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23 Extensibility 


Contents 


23.1 Foreign namespaces and private data 
23.2 Embedding foreign obiect types 
23.3 The “foreignObiect” element 
23.4 An example 
23.5 Adding private elements and attributes to the DTD 
23.6 DOM interfaces 
23.6.1 Interface SVGForeignObiectElement 


23.1 Foreign namespaces and private data 


SVG allovvs inclusion of elements from foreign namespaces anyvvhere vvith the SVG content. In general, the SVG 
user agent vvill include the unknovvn elements in the DOM but vvill othervvise ignore unknovn elements. (1he 
notable exception is deseribed under Embedding Foreign Obiect Types.) 

Additionally, SVG allovvs inclusion of attributes from foreign namespaces on any SVG element. The SVG user 
agent vvill include unknovvn attributes in the DOM but vvith othervvise ignore unknovvrn attributes. 

SVGs ability to include foreign namespaces can be used for the follovving purposes: 


e Application-specific information so that authoring applications can include model-level data in the SVG con- 
tent to serve their "roundtripping" purposes (i.e., the ability to vvrite, then read a file vvithout 1oss of higher- 
level information). 

e Supplemental data for extensibility. For example, suppose you have an extrusion extension vvhich takes any 
2D graphics and extrudes it in three dimensions. VVhen applying the extrusion extension, you probably vvill 
need to set some parameters. The parameters can be included in the SVG content by inserting elements from 
an extrusion extension namespace. 


To illustrate, a business graphics authoring application might vvant to include some private data vvithin an SVG 
document so that it could properly reassemble the chart (a pie chart in this case) upon reading it back in: 


e?xml versione"1.0" standalonez"yes"?s 
xsvg vidth-"4in" height-"3in" versionz"1.1" 
xmlns z "http:/ /vuv.v/3.org/2000/svg"” 
xdeTss 
xmyapp:piechart xmlns:myappe"http://example .org/myapp" 
titlezc"Sales by Region" 
€myapp:pieslice label-"Northern Region" valuez"1.23"/5 
€myapp:pieslice label-"Eastern Region" valuez"2.53"/5 
emyapp:pieslice label-"Southern Region" valuez"3.89"/- 
€myapp:pieslice label-"Mestern Region" valuez"2.04"/5 
c1-- ÜUther private data goes here --x 
xc/myapp:piechart” 
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xc/defsə” 
edesceThis chart includes private data in another namespace 
xs/desc” 
c1-- In here vould be the actual SVG graphics elements vhich 
drav the pie chart --s 
c/ svg” 


23.2 Embedding foreign obiect types 


One goal for SVG is to provide a mechanism by vvhich other XML language processors can render into an area 
vvithin an SVG dravving, vvith those renderings subiect to the various transformations and compositing parameters 
that are currently active at a given point vvithin the SVG content tree. One particular example of this is to provide 
a frame for XML content styled vvith CSS or XSL so that dynamically reflovving text (subiect to SVG transform- 
ations and compositing) could be inserted into the middle of some SVG content. Another example is inserting a 
MathML expression into an SVG dravving İMATHMLI. 

The “foreignObiect” element allovvs for inclusion of a foreign namespace vvhich has its graphical content 
dravvn by a different user agent. The included foreign graphical content is subyect to SVG transformations and 
compositing. 

The contents of “foreignObfect” are assumed to be from a different namespace. Any SVG elements vvithin 
a “foreignObieet” vvill not be dravn, except in the situation vvhere a properly defined SVG subdocument vvith a 
proper “xm1ns” (see Namespaces in XML IXML-NSİ) attribute specification is embedded recursively. One situation 
vvhere this can occur is vvhen an SVG document fragment is embedded vvithin another non-SVG document frag- 
ment, vvhich in turn is embedded vvithin an SVG document fragment (e.g., an SVG document fragment contains 
an XHTML document fragment vvhich in turn contains yet another SVG document fragment). 

Usually, a “ToreignObieet” vvill be used in conğunction vvith the “svvitch” element and the “requiredExtensions” 
attribute to provide proper checking for user agent support and provide an alternate rendering in case user agent 
support is not available. 


23.3 The “foreignObiect” element 


Categories: “ToreignObiect” 
None 


Content model: 
Any elements or character data. 


Attributes: 
core attributes 
conditional processing attributes 
graphical event attributes 
presentation attributes 


“class” 


“style” 
“externalResourcesRequired” 


“transform” 


s. 


x 


v.s 


y 
“vidth” 
“height” 
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DOM Tnterfaces: 
SVGForeignObiectElement 


Attribute definitions: 





x — "ccoordinates" 
"The x-axis coordinate of one corner of the rectangular region into vvhich the graphics associated vvith the 
contents of the “foreignObiect” vvill be rendered. 
If the attribute is not specifted, the effect is as if a value of "0" vvere specifted. 


Animatable: yes. 


y — "-coordinate-" 
"The y-axis coordinate of one corner of the rectangular region into vvhich the referenced document is placed. 
If the attribute is not specifted, the effect is as if a value of "0" vvere specifted. 
Animatable: yes. 


vidth - "-lengths" 
"The vvidth of the rectangular region into vvhich the referenced document is placed. 
A negative value is an error (see Error processing). A value of zero disables rendering of the element. 
Animatable: yes. 


height — "-length-" 
"The height of the rectangular region into vvhich the referenced document is placed. 
A negative value is an error (see Error processing). A value of zero disables rendering of the element. 


Animatable: yes. 


23.4 An example 


Here is an example: 


e?xml versione"1.0" standalonez"yes"?z 
xsvg vidth-"4in" height-"3in" versionz"1.1" 
xmlns z "http://vuv.v3.0rg/2000/svg"” 
edesceThis example uses the "suvitch" element to provide a 
Tallback graphical representation of an paragraph, if 
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XMHTML is not supported.-/descx” 
c1-- The "suvitch" element vill process the first child element 
vhose testing attributes evaluate to true.--s 
€svitch” 
c1-- Process the embedded XHTML if the requiredExtensions attribute 
evaluates to true (i.e., the user agent supports XHTML 
embedded vithin SVG). --s 
eforeignübiect vidth-"100" height-"50" 
requiredExtensionse"http://example . com/SVGExtensions/EmbeddedXHTML"z 
c1-- XHTML content goes here --x 
sebody xmlnsze"http:/ /vuv..v/3.0rg/ 1999/xhtml"- 
eprHere is a paragraph that requires vord vrape/p” 


c/ body” 
c/Tforeignübiect- 
c1-- Else, process the folloving alternate SVG. 


Note that there are no testing attributes on the "text" element. 
If no testing attributes are provided, it is as if there 
vere testing attributes and they evaluated to true.--” 
etext font-sizeze"10" font-family-"Verdana"x 
ctspan xe"10" y-"10"-Here is a paragraph that-c/tspanx 
ctspan xe"10" y-"20"-requires vord vrap.ce/tspanx 
c/text” 
c/svitchs 
c/ svg” 


İt is not required that SVG user agent support the ability to invoke other arbitrary user agents to handle embedded 
foreign obyect types: hovvever, all conforming SVG user agents vvould need to support the “svvitch” element and 
must be able to render valid SVG elements vvhen they appear as one of the alternatives vvithin a “svviteh” element. 
Ultimately, it is expected that commercial VVeb brovvsers vvill support the ability for SVG to embed content 
from other XML grammars vvhich use CSS or XSL to format their content, vvith the resulting CSS- or XSL-format- 
ted content subiect to SVG transformations and compositing. At this time, such a capability is not a requirement. 


23.5 Adding private elements and attributes to the DTD 


Using foreign namespaces as an extension mechanism adds flexibility, is readily handled by validation technolo- 
gies like NVDL and RelaxNG, but typically breaks DTD validation unless the DTD has explicit extensibility hooks. 
The SVG DTD allovvs for extending the SVG language vvithin the internal DTD subset. VVithin the internal 
DTD subset, you have the ability to add custom elements and attributes to most SVG elements. This facility may 
be used if DTD validation is desired. 
The DTD defines an extension entity for most of SVG elements. For example, the “vievv” element is defined in 
the DTD as follovvs: 


€lENTİTY $ SVG.viev.extra. content "" s 


€lENTİTY $ SVG.viev.element "INCLUDE" 5 
el İSSVG.viev.element, 1 
€lENTİTY $ SVG.viev.content 
"( S5SVG.Description.class, S:SVG.viev.extra.content, )”" 


- 
ce ELEMENT “5SVG..viev.qname, 5S55VG.viev. content, x 
c1-- end of SVG.viev.element --s115 


€1ENTİTY $ SVG.viev.attlist "INCLUDE" 5 


el İSSVG.viev.attlist,l 
€ ATTLIST S5SVG.viev  qname , 
S58VG.Core.attrib, 
S5SVG.External.attrib, 
vievBox SsVievBoxSpec.datatype, £T1MPLTED 
preserveAspectRatio 5s:PreserveAspectRatioSpec.datatype, "xMidYMid meet" 
zoomAndPan ( disable / magnify ) "magnify" 
vievTarget CDATA £TIMPLTED 
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- 
c€1-- end of SVG.viev.attlist --s11- 


"The entity SVG.viev.extra.content can be defined in the internal DTD subset to add custom sub-elements at- 
tributes to the “vievr” element vvithin a given document, and an “IATTLIST? can be used to add custom attributes. 
For example, the follovving extends the “vievv” element vvith an additional child element “customNS:customElement” 
and an additional attribute “customNS:customAttr”: 


e?xml versione"1.0" standalonez"no"?s 

x IDOCTYPE svg PUBLİC "-//3C//DTD SVG 1.1//EN" 
"http: //vv.v/3.org/Graphics/SVG/1.1/DTD/svg11.dtd" 1 

xENTİTY 55 SVG.viev.extra.content "İ customNS:customElement" 5 

€ 1ATTLIST S5SVG.viev. qname , 
xmlns: customNS CDATA £FIXED "http: / /vəvv.. example .org/ customNS" 
customNS:customAttr CDATA £1IMPLIED”- 

ce ELEMENT customNS: customElement EMPTY”- 

€1ATTLIST customNS: customElement 
xmlns:customNS CDATA £FIXED "http: / /vuvv.. example .org/ customNS" 
info CDATA £IMPLIED”- 

1- 

xsvg xmlnsz"http: //vvuv.v3.org/2000/svg" versione"1.1" 

vidth-"8cm" height-"4cm"- 
edescsExtend the "viev" element via the internal DTD subset-c/desc” 
c1-- Presumably, some great graphics vould go here, --s 
c€viev vieuvBoxz"100 110 20 30" customNS:customAttr-"123"- 
ccustomNS: customElement infoz"abc"/s 

c/Vİiev” 

x/ svg” 





23.6 DOM interfaces 


23.6.1 Interface SVGForeignObiectElement 


The SVGForeignObiectElement interface corresponds to the “foreignObiect” element. 


interface SV6ForeignObiectElement : SVGElement, 
SV6Tests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVGStylable, 
SVGTransformable 1 
readonly attribute SVGAnimatedLength x, 
readonly attribute SVGAnimatedLength y, 
readonly attribute SVGAnimatedLength vidth, 
readonly attribute SVGAnimatedLength height, 
y 


Attributes: 


e X (readonly SVGAnimatedLength) 


Corresponds to attribute “x” on the given “foreignObiect” element. 
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y (readonly SVGAnimatedLength) 


Corresponds to attribute “y” on the given “ToreignObiect” element. 


vvidth (readonly SVGAnimatedLength) 


Corresponds to attribute “vridth” on the given “foreignObiect” element. 





e height (readonly SVGAnimatedLength) 


Corresponds to attribute “height” on the given “foreignObiect” element. 


Appendix A: Document Type Definition 


Contents 
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A.1 mtroduction 
A.2 Modularization 
A.2.1 Element and attribute collections 
A.2.2 Profiling the SVG specification 
A.2.3 Practical considerations 
A.3 SVG 1.1 module definitions and DTD implementations 
A.3.1 Modular Framevvork Module 
A.3.2 Datatypes Module 
A.3.3 Qualified Name Module 
A.3.4 Core Attribute Module 
A.3.5 Container Attribute Module 
A.3.6 Vievvport Attribute Module 
A.3.7 Paint Attribute Module 
A.3.8 Basic Paint Attribute Module 
A.3.9 Paint Opacity Attribute Module 
A.3.10 Graphics Attribute Module 
A.3.11 Basic Graphics Attribute Module 
A.3.12 Document Events Attribute Module 
A.3.13 Graphical Element Events Attribute Module 
A.3.14 Animation Events Attribute Module 
A.3.15 XLink Attribute Module 
A.3.16 External Resources Attribute Module 
A.3.17 Structure Module 
A.3.18 Basic Structure Module 
A.3.19 Conditional Processing Module 
A.3.20 Image Module 
A.3.21 Style Module 
A.3.22 Shape Module 
A.3.23 Text Module 
A.3.24 Basic Text Module 
A.3.25 Marker Module 
A.3.26 Color Profile Module 
A.3.27 Gradient Module 
A.3.28 Pattern Module 
A.3.29 Clip Module 
A.3.30 Basic Clip Module 
A.3.31 Mask Module 
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A.3.32 Filter Module 
A.3.33 Basic Filter Module 
A.3.34 Cursor Module 
A.3.35 Hyperlinking Module 
A.3.36 Vievv Module 
A.3.37 Seripting Module 
A.3.38 Animation Module 
A.3.39 Font Module 
A.3.40 Basic Font Module 
A.3.41 Extensibility Module 
A.A SVG 1.1 Document Type Definition 
A.4.1 SVG 1.1 DTD Driver 
A.4.2 SVG 1.1 Document Model 
A.4.3 SVG 1.1 Attribute Collection 


This appendix is normative. 


A.1 İntroduction 


"This appendix defines a DTD for SVG 1.1, vvhich is used as part of determining vvhether a given document or doc- 
ument fragment is conforming. See Conformance Criteria for details on hovv the DTD is to be used in this regard. 
Note in particular that simply validating a given XML document against this DTD cannot definitively, by itself, 
determine conformance to this specification. 

If errors are found in this DTD, then they vvill be listed in the SVG 1.1 Second Edition errata. A dated 
version of the flattened DTD vvill alvvays be available from http://vvvvvv.vv3.org/Graphics/SVG/1.1/DTD/ 
svg11-flat-20110816.dtd. 


A.2 Modularization 


"The modularization of SVG included here is a decomposition of SVG 1.0 İSVG10) and errata into a collection of 
abstract modules that provide specific units of functionality. These modules may be combined vvith each other and 
vvith modules defined in other specifications (such as XHTML ) to create SVG subset and extension document types 
that qualify as members of the SVG family of document types. See Conformance for a description of SVG family 
documents, and An XHTML z MathML 4 SVG Profile TAHTMLplusMathMLplusSVG)l for a profile that combines 
XHTML, MathML and SVG. 

Each mafor section of the SVG specification corresponds to a module named after that section, e.g. "Text 
Module" or "Basic Structure Module". A module vvithout the "Basic" prefix implies that the module includes the 
complete set of elements and attributes, vvith no restrictions, from the corresponding section of the specification. If 
there is a need to provide a subset of the functionality of the complete module, then a Basic module is created vvith 
the "Basic" prefix added to the name of the complete module. For example, the "Basic Text Module" is a subset of 
the "Text Module". 
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İt is an error for a profile of SVG 1.1 to include both the complete module and its basic subset (e.g. the "Text 
Module" and the "Basic Text Module"). 


A.2.1 Element and attribute collections 


Most modules define a named collection of elements or attributes. These collections are used as a shorthand vvhen 
describing the set of attributes allovved on a particular element (e.g. the "Style" attribute collection) or the set of 
elements allovved as children of a particular element (e.g. the "Shape" element collection). AlI collections have 
names that begin vvith an uppercase character. 

VVhen defining a profile, it is assumed that all the element and attribute collections are defined to be empty. 
"That vvay, a module can redefine the collection as it is included in the profile, adding elements or attributes to 
make them available vvithin the profile. Therefore, it is not a mistake to refer to an element or attribute collection 
from a module that is not included in the profile, it simply means that collection is empty. 

The exception to this is the collection Presentation.attrib, vvhich is the union of all the presentation attribute 
collections (i.e. all the attribute collections vvith the string "Presentation" in their name). Presentation.attrib is not 
defined in any module, but it exists in every profile. 

A subset module (i.e. a Basic module) may define a different named collection from a superset module. Since 
it is an error to include a subset and superset module of the same group in a profile, all attribute and element 
collections vvill either be defined once by the module that includes them, or vvill have their default empty value 
(again, vvith the exception of Presentation.attrib vvhich is not defined by any module). 


A.2.2 Profiling the SVG specification 


"The modularization of SVG 1.1 allovvs profiles to be described by listing the SVG modules they allovv and possibly 
a small number of restrictions or extensions on the elements provided by those modules. 

The "Full" profile of SVG 1.1 is the collection of all the complete modules listed in this specification (i.e., every 
module that is not a subset module). 

VVhen applied to conformance, the unqualified term "SVG" implies the "Full" profile of SVG 1.1 defined by 
this specification. If an implementation does not implement the Full profile, it must state either the profile to vvhich 
it conforms, or that it implements a subset of SVG. 


A.2.3 Practical considerations 


DTD-based modularization has proven to be an unvvieldy method of defining composable XML languages, due 
to the inherent inability to deseribe certain complex content models in DTDs as vvell as their being agnostic vvith 
respect to XML namespaces. VVhile the SVG 1.1 DTD is provided in a modularized form, it is recommended that 
alternate technologies such as Namespace-based Validation Dispatch Language İNVDLİ) be used to accomplish 
XML language composition instead. 


A.3 SVG 1.1 module definitions and DTD implementations 


"This section contains the formal definition of each of the SVG abstract modules as a DTD module. Any element 
and attribute collections defined by the module are also listed. 
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A.3.1 Modular Framevvork Module 


2263572555...” --5 
c1-- SVG 1.1 Modular Framevork Module ...................................... -- 
c1-- file: svg-framevork.mod 


This is SVG, a language for describing tvo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), ATI Rights Reserved. 
Revision: $I1d: svg-framevork.mod,v 1.3 2011/07/08 03:18:59 cmccorma Exp $ 


This DTD module is identified by the PUBLIC and SYSTEM identifiers: 





PUBLIC "-//3C//ENTITIES SVG 1.1 Modular Framevork//EN" 
SYSTEM "http: / /vvv/.v/3.org/Graphics/SVG/1.1/DTD/ svg - framevork.mod" 


x1-- Modular Framevork 


This module instantiates the modules needed to support the SVG 
modularization model, including: 


Datatypes 

Qualified Name 
Document Model 
Attribute Collection 


YORUR 


1-5 


€1ENTİTY 55 svg-datatypes .module "İNCLUDE" 5 
cl İSssvg-datatypes .module, 1 
€1ENTITY 5 svg-datatypes.mod 
PUBLIC "-//3C//ENTITIES SVG 1.1 Datatypes//EN" 
"svg-datatypes.mod" x 
5ssvg-datatypes.mod, 115 


€ VENTİTY 5: svg-qname.mödule "İNCLUDE" 5 
cl 1Sssvg--qname .module, 1 
€ VENTİTY S: svg-qname .mod 
PUBLIC "-//3C//ENTITIES SVG 1.1 Qualified Name//EN" 
"svg-qname.mod" 5 
55svg -qname .mod, 115 


€1ENTİTY 55 svg-model.module "İNCLUDE" 5 

cl 15ssvg--model .module, 1 

c€1-- instantiate the Document Model declared in the DTD driver --x 
5ssvg -model .mod, 115 


€IENTİTY $ svg-attribs.module "INCLUDE" 5 

cl İSssvg-attribs.module, 1 

c1-- instantiate the Attribute Collection declared in the DTD driver --x 
Sssvg-attribs.mod, 115 


xc1-- end of svg-fTramevork.mod --5 


A.3.2 Datatypes Module 


c1-- file: svg-datatypes.mod 


This is SVG, a language for describing tvo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), ALL Rights Reserved. 
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Revision: $I1d: svg-datatypes.mod,v 1.3 2011/07/08 03:18:58 cmccorma Exp $ 
This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//3C//ENTITIES SVG 1.1 Datatypes//EN" 
SYSTEM "http: / /uvv/.vV3.org/Graphics/SVG/1.1/DTD/svg-datatypes.mod" 


c1-- Datatypes 


This module declares common data types for properties and attributes. 
--- 


c1-- feature specification --x 
€IENTİTY 55 Boolean.datatype "( false İl true )" s 


c€1-- "clip-rule" or "fill-rule" property/attribute value --x 
€lENTİTY $ ClipFillRule.datatype "( nonzero İ evenodd 1 inherit )" 


c1-- media type, as per İIRFC2045) --- 
€ENTİTY 55 ContentType.datatype "CDATA" x 


xc1-- a ccoordinates --s 
€lENTİTY 55 Coordinate.datatype "CDATA" 5 


c1-- a list of -coordinatess --s 
€lENTİTY 55 Coordinates.datatype "CDATA" 5 


c1-- a ccolors value --s 
€1ENTİTY 55 Color.datatype "CDATA" x 


v1l-- a cintegers --x 
€IENTİTY $ Integer.datatype "CDATA" 5 


c1-- a language code, as per İBCP47) --s 
€ENTİTY 55 LanguageCode .datatype "NMTOKEN" x 


c1-- comma-separated list of language codes, as per İBCP47) --x 
€ENTİTY 55 LanguageCodes .datatype "CDATA" 5 


c1-- a clengthx --s 
€lENTİTY 55 Length.datatype "CDATA" 5 


c1-- a list of -clengthxs --s 
€IENTİTY 55 Lengths.datatype "CDATA" x 


c1-- a cnumbers --s 
€1ENTİTY 55 Number.datatype "CDATA" 5 


c1-- a list of -numberss --x 
€1ENTİTY 55 Numbers.datatype "CDATA" 5 


c1-- opacity value (e.g., enumbers) --x 
€lENTİTY $ ÜpacityValue.datatype "CDATA" 5 


c1-- a path data specification --x 
€IENTİTY 5 PathData.datatype "CDATA" 5 


c1-- "preserveAspectRatio" attribute specification --x 
€lENTİTY 55 PreserveAspectRatioSpec.datatype "CDATA" x 


c1-- script expression --x 
€lENTİTY $ Script.datatype "CDATA" 5 


x1-- An SVG color value (RGB plus optional TCC) --s 
€ENTİTY 55 SVGColor.datatype "CDATA" 5 


c1-- arbitrary text string --x 
€IENTİTY $ Text.datatype "CDATA" 5 


c1-- list of transforms --x 
€IENTİTY 55 TransformList.datatype "CDATA" 5 


€1-- a Uniform Resource Identifier, see İURI) --x 
€lENTİTY 55 URİ.datatype "CDATA" 5 


c1-- "VieuvBox" attribute specification --x 
€lENTİTY 55 VievBoxSpec.datatype "CDATA" x 


c1-- end of svg-datatypes.mod --x 


A.3.3 Qualified Name Module 
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e1-- SVG 1.1 Qualified Name Module ......................................... --5 
c1-- file: svg-qname.mod 


This is SVG, a language for describing tvo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), ATLI Rights Reserved. 
Revision: $1d: svg-qname.mod,v 1.3 2011/07/08 03:18:59 cmccorma Exp $ 
This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//3C//ENTITIES SVG 1.1 Qualified Name//EN" 
SYSTEM "http: / /vvv.v3.org/Graphics/SVG/1.1/DTD/ svg-qname mod" 





c1-- Qualified Name 
This module is contained in tvo parts, labeled Section "A" and "B": 
Section A declares parameter entities to support namespace- 
qualified names, namespace declarations, and name prefixing 


Tor SVG and extensions. 


Section B declares parameter entities used to provide 
namespace-qualified names for all SVG element types: 


--- 

c1-- Section A: SVG XML Namespace Framevork :::::::::::1::1:11:11:11:11 --5 

c€1-- 1. Declare a SSVG.prefixed, conditional section keyvord, used 
to activate namespace prefixing. The default value should 
inherit "SNS.prefixed," from the DTD driver, so that unless 
overridden, the default behaviour follovs the overal1l DTD 
prefixing scheme. 

--- 

€lENTİTY $ NS.prefixed "IGNORE" x 

€lENTİTY 55 SVG.prefixed "S.NS.prefixed," x 


c1-- 2. Declare a parameter entity (eg., S5SVG.xmlns,) containing 
the URI reference used to identify the SVG namespace: 


--- 

€VENTİTY 55 SVG.xmlns "http: / /vv/.v/3.0T9/2000/svg" s 

€VENTİTY 5. XLINK.xmlns "http: / /vvv.v3.o0rg/1999/x1ink" s 

c1-- 3. Declare parameter entities (eg., S5VG.prefix,) containing 
the default namespace prefix string(s) to use vhen prefixing 
is enabled. This may be overridden in the DTD driver or the 
internal subset of an document instance. If no default prefix 
is desired, this may be declared as an empty string. 

-— 

€ENTİTY $ SVG.prefix ""s 

€IENTİTY $ XLINK.prefix "xlink" x 


c1-- 4. Declare parameter entities (eg., S58VG.pfx,) containing the 
colonized prefix(es) (eg., ""SSVG.prefix,:") used vhen 
prefixing is active, an empty string vhen it is not. 

- 

cl İSSVG.prefixed,l 

€ENTİTY 55 SVG.pfx "SSSVG.prefix,:" s 

11: 

€ VENTİTY 

€VENTİTY 


36 SVG.pfx ""s 

95 XLINK.pfx "SSXLINK..prefixş:" s 

c1-- 5. The parameter entity 555VG.xmlns.extra.attrib, may be 
redeclared to contain any non-SVG namespace declaration 
attributes for namespaces embedded in SVG. The default 
is an empty string. 
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--- 
€IENTİTY $ SVG.xmlns.extra.attrib "" s 


c1-- Declare a parameter entity XLINK.xmlns.attrib containing 
the XML Namespace declarations for XLink. 
--- 
€IENTİTY $ XLINK.xmlns.attrib 
"xmlns:5S:XLINK.prefix, SUR1.datatype, £FIXED "S5XLINK. xmlns, "" 
z 


c1-- Declare a parameter entity 5NS.decl.attrib, containing 
all XML Namespace declarations used in the DTD, plus the 
xmlns declaration for SVG, its form dependent on vhether 
prefixing is active. 

--- 

cl İS5SVG.prefixed:l 

€IENTİTY $ NS.decl.attrib 
"xmlns:5:SVG.prefix, SURI.datatype, £FIXED "S.SVG.xmlns, " 
955XLINK.xmlns.attrib, 
358VG.xmlns.extra.attrib," 

z 

11: 

€IENTİTY $ NS.decl.attrib 
"ŞXLINK.xmlns.attrib, 
358VG.xmlns.extra.attrib," 


z 

c1-- Declare a parameter entity SSVG.xmlns.attrib, containing 
all XML namespace declaration attributes used by SVG, 
including a default xmlns attribute vhen prefixing is 
inactive. 

--- 


cl İS5SVG.prefixed,l 

€lENTİTY $ SVG.xmlns.attrib 
"S5SNS.decl.attrib," 

z 

11: 

€lENTİTY $ SVG.xmlns.attrib 
"xmlns SsURT.datatype, £FIXED "S5SVG.xmlns, " 
95XLINK.xmlns.attrib," 

z 


c1-- Section B: SVG Qualified Names 





c1-- 6. This section declares parameter entities used to provide 
namespace-qualified names for all SVG element types. 

--- 

c1-- module: svg-structure.mod ......................... --- 

€ENTİTY 55 SVG.svg.qname "SSSVG.pfTx, svg" xs 

€ENTİTY 55 SVG.g.qname "SsSVG.pfx,g" s 

€ ENTİTY 55 SVG.defTs.qname "S:SVG.pfTx,şdefs" s 

€ENTİTY 55 SVG.desc.qname "S5SVG.pfxşdesc" s 

€IENTİTY $ SVG.title.qname "SSVG.pfx,title" s 

€ENTİTY 55 SVG.metadata.qname "5S:SVG.pfTx,şmetadata" xs 

€ENTİTY 55 SVG.symbol.qname "S:SVG.pfx,symbol" s 

€ ENTİTY 55 SVG.use.qname "SSSVG.pfTxşuse" xs 

c1-- module: svg-conditional.mod ....................... --- 


€lENTİTY $ SVG.svitch.qname "5S:SVG.pfx,svitch" s 

c1-- module: svg-image.mod ............................. --5 
€lENTİTY 55 SVG.image.qname "SSSVG.pfx, image" xs 

c1-- module: svg-style.mod ............................. --5 


€lENTİTY 55 SVG.style.qname "SSSVG.pfx,style" s 





c1-- module: svg-shape.mod ............................. --5 


€ENTİTY 55 SVG.path.qname "S:SVG.pfx,path" s 
€lENTİTY 55 SVG. rect.qname "S5SVG.pfx, rect" s 
€IENTİTY $ SVG.circle.qname "S5SVG.pfx,circle" s 
€1ENTİTY 55 SVG.line.qname "S:SVG.pfx,line" s 


€1ENTİTY 55 SVG.ellipse.qname "SsSVG.pfxşellipse" xs 
€1ENTİTY 55 SVG.polyline.qname "5S:SVG.pTx, polyline" s 
€1ENTİTY 55 SVG.polygon.qname "SSSVG.pfTx?, polygon" s 


c1-- module: svg-text.mod .............................. --- 


SIENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 


SVG.text.qname "5sSVG.pfx, text" s 

SVG.tspan.qname "S:SVG.pfx, tspan" x 
SVG.trefT.qname "5SsSVG.pfxş tref" s 
SVG.textPath.qname "S:SVG.pfTx, textPath" x 
SVG.altGlyph.qname "SsSVG.pfx,altGlyph" 5 
SVG.altGlyphDef .qname "5S:SVG.pTx,şaltGlyphDef" s 
SVG.altGlyphItem.qname "S:SVG.pfx,şaltGlyphItem" x 
SVG.glyphRef .qname "SsSVG.pfTx,glyphRef" x 
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c1-- module: svg-marker.mod ............................ --- 
€ENTİTY 55 SVG.marker .qname "S5SVG.pfx,marker" s 

c1-- module: svg-profile.mod ........................... --- 
€ENTİTY 55 SVG.color-profile.qname "SSSVG.pfx, color-profile" s 


c1-- module: svg-gradient.mod .......................... --- 





€IENTİTY $ SVG.linearGradient.qname "S:SVG.pfx, linearGradient" x 
€lENTİTY 55 SVG. radialGradient.qname "5S:SVG.pTx, radialGradient" 5 
€lENTİTY 55 SVG.stop.qname "S:SVG.pfTx,stop" s 

c1-- module: svg-pattern.mod ........................... --- 
€ENTİTY 55 SVG.pattern.qname "SSSVG.pfTx, pattern" s 

c1-- module: svg-clip.mod .............................. --- 
€IENTİTY $ SVG.clipPath.qname "S:5VG.pfx,clipPath" s 


c1-- module: svg-mask.mod .............................. --- 


€ENTİTY 55 SVG.mask.qname "S5SVG.pfx,şmask" s 





c1-- module: svg-filter.mod ............................ --- 


€IENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 


SVG.filter.qname "SsSVG.pfx,filter" s 
SVG.feBlend.qname "5:SVG.pfx, feBlend" xs 

SVG.feColorMatrix.qname "5:SVG.pfx, feColorMatrix" s 

SVG. feComponentTransfer.qname "5:SVG.pfTx” feComponentTransfer" x 
SVG. feComposite .qname "5“:SVG.pTx, feComposite" xs 

SVG. feConvolveMatrix.qname "5:SVG.pfx, feConvolveMatrix" xs 
SVG.feDiffuseLighting.qname "5:SVG.pfx,feDiffuseLighting" 5 
SVG.feDisplacementMap .qname "5:SVG.pfx, feDisplacementMap" x 
SVG.feFlood.qname "5:SVG.pfx, feFlood" xs 

SVG. feGaussianBlur.qname "SsSVG .pfx, feGaussianBlur" xs 
SVG.felmage.qname "":SVG.pfx, felmage" x 

SVG. feMerge.qname "5:SVG.pfx, feMerge" xs 

SVG. feMergeNode .qname "S:SVG.pfx, feMergeNode" 5 

SVG. feMorphology .qname "S5SVG.pfTx, feMorphology" 5 
SVG.fe0f1fset.qname "SsSVG.pTx, Te0ffset" s 
SVG.feSpecularLighting.qname "5:SVG.pfx, feSpecularLighting" x 
SVG.feTile.qname "S:5VG.pfx,feTile" x 

SVG. feTurbulence. qname "S:SVG.pfx, feTurbulence" x 
SVG.feDistantLight.qname "5:5VG.pfx,feDistantLight" 5 
SVG.fePointLight.qname ""5SVG.pfx,fePointLight" x 
SVG.feSpotLight.qname "5":SVG.pfTx,feSpotLight" xs 

SVG. feFuncR.qname "5:SVG.pfx, feFuncR" xs 

SVG. feFuncG.qname "5:SVG.pfx, feFuncG" 
SVG. feFuncB.qname "5:SVG.pfx, feFuncB" 
SVG. feFuncA.qname "5:SVG.pfx, feFuncA" 
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c1-- module: svg-cursor.mod ............................ --- 
€ENTİTY 55 SVG.cursor.qname "S5SVG.pfx, cursor" s 
c1-- module: svg-hyperlink.mod ......................... --- 


€ENTİTY 55 SVG.a.qname "SSSVG.pfxşa" xs 
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c1-- module: svg-viev.mod .............................. --- 
€ ENTİTY 55 SVG.viev.qname "S:SVG.pfTx,viev" xs 

c1-- module: svg-script.mod ............................ --- 
€lENTİTY $ SVG.script.qname "S:SVG.pfx,script" s 

c1-- module: svg-animation.mod ......................... --- 
€1ENTİTY 55 SVG.animate. qname "SSSVG.pfTxşanimate" xs 

€ENTİTY 55 SVG.set.qname "SSSVG.pfTx,set" s 

€1ENTİTY 55 SVG.animateMotion .qname "S5SVG.pfx,animateMotion" x 
€1ENTİTY 55 SVG.animateColor.qname "5S:SVG.pfxş animateColor" 5 


€lENTİTY 55 SVG.animateTransform.qname "5S:SVG. pfx,ş animateTransform" xs 
€ ENTİTY 55 SVG.mpath.qname "SsSVG.pfx,mpath" s 


c1-- module: svg-font.mod .............................. -- 
€ENTİTY 55 SVG.font.qname "S:SVG.pfx,Tfont" s 

€ ENTİTY 55 SVG.font-fTace.qname "SSSVG.pTx? font-face" s 

€VENTİTY 55 SVG.glyph.qname "SSSVG.pfx,glyph" s 

€lENTİTY $ SVG.missing-glyph.qname "S5SVG.pfx,missing-glyph" s 
€ENTİTY 55 SVG.hkern.qname "SSSVG.pfx,hkern" s 

€1ENTİTY 55 SVG.vkern.qname "SSSVG.pfx,vkern" s 

€1ENTİTY 55 SVG.font-face-src.qname "SSSVG.pfx, font-face-src" s 
€ENTİTY 55 SVG.font-face-uri.qname "SSSVG.pfx, font-face-uri" xs 

€ ENTİTY 55 SVG. font-face-format.qname "5S5SVG. pfx, font-face-format" xs 
€ENTİTY 55 SVG. font-fTace-name .qname "S:SVG.pTx, font-face-name" 5 
c€1-- module: svg-extensibility.mod ..................... -- 


€lENTİTY 55 SVG.foreignObiect.qname "S5SVG.pfx, foreignübiect" s 


c1-- end of svg-qname.mod --5 


A.3.4 Core Attribute Module 


The Core Attribute Module defines the attribute collection Core.attrib that is the core set of attributes that can be 
present on any element. 





c1-- file: svg-core-attrib.mod 


This is SVG, a language for describing tvo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), ATI Rights Reserved. 
Revision: $1d: svg-core-attrib.mod,v 1.2 2011/07/08 03:18:58 cmccorma Exp $ 
This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//3C//ENTITIES SVG 1.1 Core Attribute//EN" 
SYSTEM "http: / /vvv..V3.org/Graphics/SVG/1.1/DTD/svg-core-attrib.mod" 


c1-- Core Attribute 
id, xml:base, xml:lang, xml:space 
This module defines the core set of attributes that can be present on 
any element. 


1-5 


€IENTİTY $ SVG.id.attrib 


"id ID FIMPLIED" 
5 


€lENTİTY $ SVG.base.attrib 


"xml:base S.UR1.datatype, £IMPLIED" 
- 


€IENTİTY $ SVG.lang.attrib 
"xml:1ang "sLanguageCode.datatype, £FIMPLTED" 
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€lENTİTY $ SVG.space.attrib 


"xml:space ( default 1 preserve ) £IMPLIED" 
- 


€lENTİTY $ SVG.Core.extra.attrib "" s 


€lENTİTY $ SVG.Core.attrib 
"SSVG.id.attrib, 
555VG.base.attrib, 
958VG.lang.attrib, 
S58VG.space.attrib, 
358VG.Core.extra.attrib," 
z 





c1-- end of svg-core-attrib.mod --x 


A.3.5 Container Attribute Module 


The Container Attribute Module defines the Container.attrib attribute collection. 





c1-- file: svg-container-attrib.mod 


This is SVG, a language for describing tvo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), ATI Rights Reserved. 
Revision: $1d: svg-container-attrib.mod,v 1.2 2011/07/08 03:18:58 cmccorma Exp $ 
This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//3C//ENTITIES SVG 1.1 Container Attribute//EN" 
SYSTEM "http: / /uvv..vV3.org/Graphics/SVG/1.1/DTD/svg-container-attrib.mod" 


c1-- Container Attribute 
enable-background 


This module defines the Container attribute set. 
--- 


xc1-- "enable-background" property/attribute value (e.g., "nev", "accumulate" ) --s 
€ENTİTY 55 EnableBackgroundValue.datatype "CDATA" 5 


€ENTİTY 55 SVG.enable-background.attrib 


"enable-background s:EnableBackgroundValue .datatype, £TMPLTED" 
z 


€lENTİTY $ SVG.Container.extra.attrib "" s 
€IENTİTY $ SVG.Container.attrib 


"S5SVG. enable-background.attrib, 
358VG.Container.extra.attrib," 


c1-- end of svg-container-attrib.mod --x 


A.3.6 Vievvport Attribute Module 
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The Container Attribute Module defines the Container.attrib attribute collection. 


Collection name İ Attributes in collection 
Vievvport.attrib clip, overflovv 





c1-- file: svg-vieuport-attrib.mod 


This is SVG, a language for describing tvo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), ALL Rights Reserved. 
Revision: $1d: svg-vieuport-attrib.mod,v 1.2 2011/07/08 03:18:59 cmccorma Exp $ 





This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//M3C//ENTITIES SVG 1.1 Vievport Attribute//EN" 
SYSTEM "http: / /vvv/..vV3.org/Graphics/SVG/1.1/DTD/svg-vieuvport-attrib.mod" 


c1-- Vieuport Attribute 
clip, overfTlov 


This module defines the Vievport attribute set. 
--- 


c1-- "clip" property/attribute value (e.g., "auto", rect(...)) --c 
€IENTİTY $ ClipValue.datatype "CDATA" x 


€lENTİTY $ SVG.clip.attrib 
"clip sClipValue.datatype, £1MPLTED" 
z 


€VENTİTY 5. SVG.overflov.attrib 
"overflov ( visible 1 hidden İ scroll 1 auto 1 inherit ) £FIMPLIED" 
- 


€lENTİTY $ SVG.Vievport.extra.attrib "" 

€lENTİTY $ SVG.Vievport.attrib 
"SSVG.clip.attrib, 
555VG.overTlov.attrib, 
358VG.Vieuvport.extra.attrib," 


z 


c1-- end of svg-vievport-attrib.mod --5 


A.3.7 Paint Attribute Module 


The Paint Attribute Module defines the Paint.attrib attribute collection. 


Collection Attributes in collection 
name 


Paint.attrib İ color, fill, fill-rule, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-lineioin, 
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x stroke-miterlimit, stroke-vvidth, color-interpolation, color-rendering 





25777” ——””””..”.”. --- 
e€1-- SVG 1.1 Paint Attribute Module .......əə əəə əəə zs R RE R al kə EsSRasəlRa --- 
c1-- file: svg-paint-attrib.mod 


This is SVG, a language for describing tuo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), All Rights Reserved. 
Revision: $I1d: svg-paint-attrib.mod,v 1.2 2011/07/08 03:18:59 cmccorma Exp $ 
This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//MN3C//ENTITIES SVG 1.1 Paint Attribute//EN" 
SYSTEM "http: //vv/.v3.org/Graphics/SVG/1.1/DTD/svg-paint-attrib.mod" 





c1-- Paint Attribute 


fill, fill-rule, stroke, stroke-dasharray, stroke-dashoffset, 
stroke-linecap, stroke-linefloin, stroke-miterlimit, stroke-vidth, color, 
color-interpolation, color-rendering 


This module defines the Paint and Color attribute sets. 
--- 


€1-- a "fill" or "stroke" property/attribute value: -painto” --s 
€IENTİTY $ Paint.datatype "CDATA" x 


c1-- "stroke-dasharray" property/attribute value (e.g., "none", list of -numberxs) --xs 
€VENTİTY 5 StrokeDashArrayValue .datatype "CDATA" 5 


c1-- "stroke-dashoffset" property/attribute value (e.g., "none", clegnthx) --x 
€ENTİTY 55 StrokeDashOffsetValue.datatype "CDATA" 5 


c1-- "stroke-miterlimit" property/attribute value (e.g., cnumberx) --xs 
€IENTİTY $ StrokeMiterLimitValue.datatype "CDATA" 5 








c1-- "stroke-vidth" property/attribute value (e.g., clengths) --s 
€I1ENTITY $ StrokeMidthValue.datatype "CDATA" x 


€VENTİTY $ SVG.fill.attrib 
"fili sPaint.datatype, FIMPLIED" 
z 


€lENTİTY $ SVG.fill-rule.attrib 
"fill-rule $ClipFillRule.datatype, £IMPLTED" 
z 


€lENTİTY $ SVG.stroke.attrib 
"stroke $5Paint.datatype, 2IMPLIED" 
z 


€lENTİTY $ SVG.stroke-dasharray.attrib 
"stroke-dasharray ":StrokeDashArrayValue .datatype, £1MPLIED" 
z 


€lENTİTY 55 SVG.stroke-dashoffset.attrib 
"stroke-dashoffset s:StrokeDashüffsetValue.datatype, £TIMPLTED" 
z 


€IENTİTY $ SVG.stroke-linecap.attrib 
"stroke-linecap ( butt 1 round l square 1 inherit ) £IMPLIED" 
z 


€1ENTITY $ SVG.stroke-lineİloin.attrib 
"stroke-linefloin ( miter İ round l bevel 1 inherit ) £FIMPLIED" 
- 


€lENTİTY $ SVG.stroke-miterlimit.attrib 
"stroke-miterlimit SStrokeMiterLimitValue.datatype, £IMPLIED" 
z 


€lENTİTY $ SVG.stroke-vidth.attrib 
"stroke-vidth $StrokelvidthValue .datatype, 2£IMPLIED" 
z 
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€IENTİTY $ SVG.Paint.extra.attrib "" s 


€IENTİTY $ SVG.Paint.attrib 
"SSVG.fill.attrib, 
SsSVG.fill-rule.attrib, 
S5SVG.stroke.attrib, 
S58VG. stroke-dasharray.attrib, 
S5SVG.stroke-dashoffset.attrib, 
558VG.stroke-linecap.attrib, 
358VG.stroke-lineioin.attrib, 
SSVG.stroke-miterlimit.attrib, 
S5SVG.stroke-vidth.attrib, 
SSVG.Paint.extra.attrib," 





z 


€lENTİTY $ SVG.color.attrib 
"color ss:Color.datatype, £1MPLTIED" 





z 


€1ENTITY $ SVG.color-interpolation.attrib 
"color-interpolation ( auto / sRGB 1 linearRGB /1 inherit ) £IMPLIED" 
z 


€1ENTIİTY $ SVG.color-rendering.attrib 
"color-rendering ( auto 1 optimizeSpeed 1 optimizeQuality 1 inherit ) 
PIMPLIED" 
z 


€IENTİTY 55 SVG.Color.extra.attrib "" s 

€lENTİTY $ SVG.Color.attrib 
"SSVG.color.attrib, 
358VG.color-interpolation.attrib, 
358VG.color-rendering.attrib, 


Ss5SVG.Color.extra.attrib," 
z 


c1-- end of svg-paint-attrib.mod --x 


A.3.8 Basic Paint Attribute Module 


"The Basic Paint Attribute Module defines the Paint.attrib attribute collection. 


Collection Attributes in collection 
name 


Paint.attrib 1 color, fill, fill-rule, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-line/oin, 


stroke-miterlimit, stroke-vvidth, color-rendering 





c€1-- file: svg-basic-paint-attrib.mod 
This is SVG, a language for describing tuvo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), ALL Rights Reserved. 
Revision: $1d: svg-basic-paint-attrib.mod,v 1.2 2011/07/08 03:18:58 cmccorma Exp $ 
This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//N3C//ENTITIES SVG 1.1 Basic Paint Attribute//EN" 
SYSTEM "http: //vv.v3.org/Graphics/SVG/1.1/DTD/svg-basic-paint-attrib.mod" 
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c1-- Basic Paint Attribute 


fill, fill-rule, stroke, stroke-dasharray, stroke-dashoffset, 
stroke-linecap, stroke-lineioin, stroke-miterlimit, stroke-vidth, color, 
color-rendering 


This module defines the Paint and Color attribute sets. 
--- 


c1-- a "fill" or "stroke" property/attribute value: -paint” --s 
€IENTİTY $ Paint.datatype "CDATA" x 


c1-- "stroke-dasharray" property/attribute value (e.g., "none", list of -numberxs) 
€1ENTİTY 55 StrokeDashArrayValue.datatype "CDATA" 5 


c1-- "stroke-dashoffset" property/attribute value (e.g., "none", clegnthx) --x 
€ENTİTY 55 StrokeDashOffsetValue.datatype "CDATA" 5 


c1-- "stroke-miterlimit" property/attribute value (e.g., cnumberx) --x 
€IENTİTY $ StrokeMiterLimitValue.datatype "CDATA" 5 


c1-- "stroke-vidth" property/attribute value (e.g., clengths) --s 
€IENTİTY $ StrokeMidthValue.datatype "CDATA" 5 


€IENTİTY $ SVG.fill.attrib 
"fili sPaint.datatype, £FIMPLIED" 
- 


€IENTİTY $ SVG.fill-rule.attrib 
"fill-rule $ClipFillRule.datatype, £IMPLTED" 
z 


€lENTİTY $ SVG.stroke.attrib 
"stroke $5?Paint.datatype, “FIMPLIED" 
- 


€IENTİTY $ SVG.stroke-dasharray.attrib 
"stroke-dasharray “:StrokeDashArrayValue.datatype, £1MPLTED" 
z 


€IENTİTY $ SVG.stroke-dashoffset.attrib 
"stroke-dashoffset 5:StrokeDashüffsetValue.datatype, £TIMPLTED" 
z 


€lENTİTY $ SVG.stroke-linecap.attrib 
"stroke-linecap ( butt / round İl square /I inherit ) FIMPLIED" 
z 


€IENTİTY $ SVG.stroke-line/İoin.attrib 
"stroke-linefloin ( miter l round / bevel 1 inherit ) FIMPLIED" 
- 


€lENTİTY $ SVG.stroke-miterlimit.attrib 
"stroke-miterlimit $StrokeMiterLimitValue.datatype, £IMPLTED" 
z 


€lENTİTY $ SVG.stroke-vidth.attrib 
"stroke-vidth s:StrokevidthValue.datatype, “FIMPLIED" 
z 


€IENTİTY $ SVG.Paint.extra.attrib "" s 


€lENTİTY $ SVG.Paint.attrib 
"SSVG.fill.attrib, 
358VG.fill-rule.attrib, 
555VG.stroke.attrib, 
358VG. stroke-dasharray.attrib, 
358VG.stroke-dashoffset.attrib, 
358VG.stroke-linecap.attrib, 
S58VG.stroke-lineioin.attrib, 
358VG.stroke-miterlimit.attrib, 
S58VG.stroke-vidth.attrib, 
358VG.Paint.extra.attrib," 


--5 


€1ENTİTY $ SVG.color.attrib 
"color 5$sColor.datatype, S£TMPLTED" 
- 


€VENTİTY $ SVG.color-rendering.attrib 
"color-rendering ( auto 1 optimizeSpeed 1 optimizeQuality I inherit ) 
PIMPLIED" 
z 


c 
.o 
5 
İv) 
m") 
(səs 
(3) 
z 
E 
ə) 
(ə) 
o 
ad 
Ə 
s 


€lENTİTY $ SVG.Color.extra.attrib "" s 


€lENTİTY $ SVG.Color.attrib 
"SSVG.color.attrib, 
555VG.color-rendering.attrib, 
358VG.Color.extra.attrib," 

z 


c1-- end of svg-basic-paint-attrib.mod --5 


A.3.9 Paint Opacity Attribute Module 





"The Paint Opacity Attribute Module defines the Opacity-attrib attribute collection. 





c1-- file: svg-opacity-attrib.mod 


This is SVG, a language for describing tvo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), ALL Rights Reserved. 
Revision: $1d: svg-opacity-attrib.mod,v 1.2 2011/07/08 03:18:59 cmccorma Exp $ 


This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//M3C//ENTITIES SVG 1.1 Paint Üpacity Attribute//EN" 
SYSTEM "http: / /vvv/..vV3.org/Graphics/SVG/1.1/DTD/svg-opacity-attrib.mod" 


c1-- Paint Üpacity Attribute 
opacity, fill-opacity, stroke-opacity 


This module defines the Opacity attribute set. 
--- 


€lENTİTY $ SVG.opacity.attrib 
"opacity S50pacityValue.datatype, £TMPLTED" 
z 


€lENTİTY $ SVG.fill-opacity.attrib 
"fill-opacity s0pacityValue.datatype, £IMPLIED" 
z 


€lENTİTY $ SVG.stroke-opacity.attrib 
"stroke-opacity 5s0pacityValue.datatype, £FIMPLIED" 
z 


€lENTİTY $ SVG.Üpacity.extra.attrib "" s 


€IENTİTY $ SVG.Üpacity.attrib 
"SSVG.opacity.attrib, 
5SVG.fill-opacity.attrib, 
555VG.stroke-opacity.attrib, 
555VG.Opacity.extra.attrib," 


c1-- end of svg-opacity-attrib.mod --x 


A.3.10 Graphics Attribute Module 
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"The Graphics Attribute Module defines the Graphics.attrib attribute collection. 


Collection name Attributes in collection 


Graphics.attrib İdisplay, image-rendering, pointer-events, shape-rendering, text-rendering, visibility 





c1-- file: svg-graphics-attrib.mod 


This is SVG, a language for describing tuvo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), ATI Rights Reserved. 
Revision: $I1d: svg-graphics-attrib.mod,v 1.2 2011/07/08 03:18:59 cmccorma Exp $ 





This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//N3C//ENTITIES SVG 1.1 Graphics Attribute//EN" 
SYSTEM "http: / /vvv/.vV3.org/Graphics/SVG/1.1/DTD/svg-graphics-attrib.mod" 


c1-- Graphics Attribute 


display, image-rendering, pointer-events, shape-rendering, 
text-rendering, visibility 


This module defines the Graphics attribute set. 
--- 


€1ENTITY $ SVG.display.attrib 
"display ( inline I block / list-item 1 run-in / compact İl marker 
table 1 inline-table 1 table-rov-group / table-header-group 1 
table-footer-group Il table-rov İl table-colum.-group 1 
table-column 1 table-cel1l / table-caption 1 none 1 inherit ) 
2FMPLIED" 
z 


€1ENTITY $ SVG.image-rendering.attrib 
"image-rendering ( auto /I optimizeSpeed 1 optimizeQuality 1I inherit ) 
SIMPLIED" 
z 


€1ENTITY $ SVG.pointer-events.attrib 
"pointer-events ( visiblePainted 1 visibleFill / visibleStroke 1 visible 1 
painted 1 fill 1 stroke 1 all 1 none 1 inherit ) 
YFE1MPLIED" 
. 


€1ENTITY $ SVG.shape-rendering.attrib 
"shape-rendering ( auto /I optimizeSpeed 1 crispEdges 1 geometricPrecision 
inherit ) £IMPLIED" 
z 


€1ENTITY $ SVG.text-rendering.attrib 
"text-rendering ( auto İl optimizeSpeed 1 optimizelegibility 1 
geometricPrecision 1 inherit ) £IMPLIED" 
z 


€1ENTITY $ SVG.visibility.attrib 
"visibility ( visible I hidden 1 inherit ) £IMPLIED" 
z 


€IENTİTY $ SVG.Graphics.extra.attrib "" 


€1ENTITY $ SVG.Graphics.attrib 


"SSVG.display.attrib, 
555VG.image-rendering.attrib, 
555VG.pointer-events.attrib, 
555VG.shape-rendering.attrib, 
55SVG.text-rendering.attrib, 
SSVG.visibility.attrib, 
358VG.Graphics.extra.attrib," 

z 
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c1-- end of svg-graphics-attrib.mod --5 


A.3.11 Basic Graphics Attribute Module 


"The Basic Graphics Attribute Module defines the Graphics.attrib attribute collection. 





c1-- file: svg-basic-graphics-attrib.mod 


This is SVG, a language for describing tvo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), ALL Rights Reserved. 
Revision: $1d: svg-basic-graphics-attrib.mod,v 1.2 2011/07/08 03:18:58 cmccorma Exp $ 


This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//M3C//ENTITIES SVG 1.1 Basic Graphics Attribute//EN" 
SYSTEM "http: / /uvv..V3.org/Graphics/SVG/1.1/DTD/svg-basic-graphics-attrib.mod" 


c1-- Basic Graphics Attribute 
display, visibility 


This module defines the Graphics attribute set. 
--- 


€IENTİTY $ SVG.display.attrib 
"display ( inline 1 block 1 list-item 1 run-in İl compact İl marker 
table 1 inline-table I table-rov-group 1 table-header-group 1 
table-footer-group l table-rov 1 table-column-group 1 
table-column 1 table-cell 1 table-caption 1 none 1 inherit ) 
21MPLIED" 
"ə 


€lENTİTY $ SVG.visibility.attrib 
"visibility ( visible I hidden 1 inherit ) £IMPLIED" 
- 


€lENTİTY $ SVG.Graphics.extra.attrib "" 

€IENTİTY $ SVG.Graphics.attrib 
"SSVG.display.attrib, 
SSVG.visibility.attrib, 
358VG.Graphics.extra.attrib," 


- 


c1-- end of svg-basic-graphics-attrib.mod --5 


A.3.12 Document Events Attribute Module 


The Document Events Attribute Module defines the DocumentEvents.attrib attribute collection. 
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000173 Iİ ə ə LL ə 0 --- 
c€1-- SVG 1.1 Document Events Attribute Module .............................. --5 
c1-- file: svg-docevents-attrib.mod 


This is SVG, a language for describing tvo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), ALL Rights Reserved. 
Revision: $1d: svg-docevents-attrib.mod,v 1.2 2011/07/08 03:18:58 cmccorma Exp $ 
This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//N3C//ENTITIES SVG 1.1 Document Events Attribute//EN" 
SYSTEM "http: / /uvv .v/3..org/Graphics/SVG/1.1/DTD/svg-docevents-attrib.mod" 


c1-- Document Events Attribute 





onunload, onabort, onerror, onresize, onscrol1, onzoom 


This module defines the DocumentEvents attribute set. 
--- 


€ENTİTY 5 SVG.onunload.attrib 
"onunload 5:Script.datatype, £IMPLTED" 
z 


€lENTİTY $ SVG.onabort.attrib 
"onabort $Script.datatype, £1MPLIED" 
z 


€IENTİTY 55 SVG.onerror.attrib 
"onerror $5Script.datatype, £1MPLIED" 
z 


€lENTİTY $ SVG.onresize.attrib 
"onresize $5Script.datatype, £IMPLTED" 
z 


€lENTİTY $ SVG.onscroll.attrib 
"onscrol1 $5Script.datatype, Z£IMPLTED" 
z 


€lENTİTY 55 SVG.onzoom.attrib 
"onzoom 5:Script.datatype, £IMPLTED" 
z 


€lENTİTY 55 SVG.DocumentEvents.extra.attrib "" s 


€lENTİTY 55 SVG.DocumentEvents.attrib 
"SSVG.onunload.attrib, 
358VG.onabort.attrib, 
358VG.onerror.attrib, 
358VG.onresize.attrib, 
358VG.onscroll.attrib, 
358VG.onzoom.attrib, 
958VG ..DocumentEvents.extra.attrib," 

z 


xc1-- end of svg-docevents-attrib.mod --5 


A.3.13 Graphical Element Events Attribute Module 


"The Graphical Events Attribute Module defines the GraphicalEvents.attrib attribute collection. 


Collection name Attributes in collection 


GraphicalEvents.attrib İl onfocusin, onfocusout, onactivate, onclick, onmousedovvn, onmouseup, onmouseover, 
onmousemove, onmouseout, onload 
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c1-- SVG 1.1 Graphical Element Events Attribute Module ..................... --- 
c€1-- file: svg-graphevents-attrib.mod 


This is SVG, a language for describing tuvo-dimensional graphics in XML. 

Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), All Rights Reserved. 

Revision: $I1d: svg-graphevents-attrib.mod,v 1.2 2011/07/08 03:18:59 cmccorma Exp $ 
This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//M3C//ENTITIES SVG 1.1 Graphical Element Events Attribute//EN" 
SYSTEM "http: / /vvv/.vV3.org/Graphics/SVG/1.1/DTD/svg-graphevents-attrib.mod" 





c1-- Graphical Element Events Attribute 


onfocusin, onfocusout, onactivate, onclick, onmousedovn, onmouseup, 
onmouseover, onmousemove, onmouseout, onload 


This module defines the GraphicalEvents attribute set. 
--- 


€IENTİTY $ SVG.onfocusin.attrib 
"onfocusin $Script.datatype, £1IMPLIED" 
z 


€lENTİTY $ SVG.onfocusout.attrib 
"onfocusout SScript.datatype, £IMPLIED" 
z 


€lENTİTY $ SVG.onactivate.attrib 
"onactivate SScript.datatype, £IMPLIED" 
z 


€IENTİTY $ SVG.onclick.attrib 
"onclick $Script.datatype, £1MPLIED" 
z 


€lENTİTY 55 SVG.onmousedovn.attrib 
"onmousedovmn $:Script.datatype, “£TMPLIED" 
z 


€1ENTİTY $ SVG.onmouseup.attrib 
"onmouseup 5$:Script.datatype, £1MPLIED" 
z 


€lENTİTY 55 SVG.onmouseover.attrib 
"onmouseover $:Script.datatype, “£IMPLIED" 
z 


€lENTİTY 55 SVG.onmousemove.attrib 
"onmousemove $:Script.datatype, “TMPLIED" 
z 


€lENTİTY $ SVG.onmouseout.attrib 
"onmouseout $Script.datatype, £IMPLIED" 
z 


€lENTİTY $ SVG.onload.attrib 
"onload $5Script.datatype, “IMPLIED" 
z 


€IENTİTY $ SVG.GraphicalEvents.extra.attrib "" s 


€1ENTITY $ SVG.GraphicalEvents.attrib 
"SSVG.onfocusin.attrib, 
958VG.onfocusout.attrib, 
S5SVG.onactivate.attrib, 


S58VG.onclick.attrib, 

35SVG. onmousedovn.attrib, 

55SVG. onmouseup.attrib, 

55SVG. onmouseover.attrib, 

55SVG. onmousemove.attrib, 

358VG.onmouseout.attrib, 

358VG.onload.attrib, 

3558VG.GraphicalEvents.extra.attrib," 
z 
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c1-- end of svg-graphevents-attrib.mod --5 


A.3.14 Animation Events Attribute Module 


The Animation Events Attribute Module defines the AnimationEvents.attrib attribute collection. 


Collection name 





AnimationEvents.attrib 





c1-- file: svg-animevents-attrib.mod 


This is SVG, a language for describing tvo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), ALL Rights Reserved. 
Revision: $1d: svg-animevents-attrib.mod,v 1.2 2011/07/08 03:18:58 cmccorma Exp $ 


This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//M3C//ENTITIES SVG 1.1 Animation Events Attribute//EN" 
SYSTEM "http: / /vvv/..vV3.org/Graphics/SVG/1.1/DTD/svg-animevents-attrib.mod" 


c1-- Animation Events Attribute 
onbegin, onend, onrepeat, onload 


This module defines the AnimationEvents attribute set. 
--- 


€IENTİTY $ SVG.onbegin.attrib 
"onbegin $Script.datatype, £1MPLIED" 
- 


€lENTİTY 55 SVG.onend.attrib 
"onend $sScript.datatype, “FIMPLIED" 
z 


€IENTİTY $ SVG.onrepeat.attrib 
"onrepeat 5$:Script.datatype, £IMPLTED" 
- 


€lENTİTY $ SVG.onload.attrib 
"onload $:Script.datatype, £IMPLTED" 
- 


€IENTİTY $ SVG.AnimationEvents.extra.attrib "" s 


€IENTİTY $ SVG.AnimationEvents.attrib 
"SSSVG.onbegin.attrib, 
558VG.onend.attrib, 
358VG.onrepeat.attrib, 
358VG.onload.attrib, 
9558VG.AnimationEvents.extra.attrib," 
z 


c1-- end of svg-animevents-attrib.mod --5 


A.3.15 XLink Attribute Module 


The XLink Attribute Module defines the XLink.attrib, XLinkRequired.attrib, XLinkEmbed.attrib and XLinkRe- 
place.attrib attribute collections. These collections differ only in vvhether the “xlink-href” attribute is required or 
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vvhat the default value for the “xlink:shovr” attribute is. 


Collection name Attributes in collection 
XLink.attrib xlinktype, xlink:href, xlink:role, xlink-arcrole, xlink:title, xlink:shovv, xlink:actuate 


XLinkEmbed.attrib İxlink:type, xlink:href, xlink-role, xlink:arcrole, xlink:title, xlink:shovv, xlink:actuate 
XLinkReplace.attrib 1 xlink:type, xlink:href, xlink-role, xlink:arcrole, xlink:title, xlink:shovv, xlink:actuate 


17777” ””””.” --- 
c€1-- SVG 1.1 XLink Attribute Module ........................................ --- 
c1-- file: svg-xlink-attrib.mod 


XLinkRequired.attrib İ xlink:type, xlink:href, xlink-role, xlink:arcrole, xlink:title, xlink:shovv, xlink:actuate 





This is SVG, a language for describing tuo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), All Rights Reserved. 
Revision: $1d: svg-xlink-attrib.mod,v 1.2 2011/07/08 03:18:59 cmccorma Exp $ 


This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//MN3C//ENTITIES SVG 1.1 XLink Attribute//EN" 
SYSTEM "http: //vv/.v3.org/Graphics/SVG/1.1/DTD/svg-xlink-attrib.mod" 


c1-- XLink Attribute 
type, href, role, arcrole, title, shov, actuate 


This module defines the XLink, XLinkRequired, XLinkEmbed, and 
XLinkReplace attribute set. 
--- 


€IENTİTY $ SVG.XLink.extra.attrib "" s 


€VENTİTY $ SVG.XLink.attrib 
"ŞXLINK.xmlns.attrib, 
955XLINK.pfx,type ( simple ) £FIXED "simple" 
95XLINK. pfx,href SSURT.datatype, £TMPLTED 
95XLINK. pfx, role SSURT.datatype, 2TMPLTED 
95XLINK. pfx,arcrole SSsURT.datatype, 2TMPLTIED 
SXLINK.pfx,title CDATA £IMPLTIED 
95XLINK. pfx, shov ( other ) "other" 
95XLINK. pfxşactuate ( onLoad ) £FIXED "onLoad" 
S5SVG.XLink.extra.attrib," 

z 


€IENTİTY $ SVG.XLinkRequired.extra.attrib "" s 


€1ENTİTY $ SVG.XLinkRequired.attrib 
"ŞXLINK.xmlns.attrib, 
955XLINK.pfx,type ( simple ) £FIXED "simple" 
95XLINK.pfTx,href SSURT.datatype, 25REQUTRED 
95XLINK. pfx, role SSURT.datatype, 2 TMPLTED 
S5XLINK. pfxşarcrole SSURT.datatype, 21MPLİIED 
SXLINK.pfx,title CDATA £IMPLIED 
S5XLINK. pfx, shov ( other ) "other" 
95XLINK. pfxşactuate ( onLoad ) £FIXED "onLoad" 
358VG.XLinkRequired.extra.attrib," 





z 


€lENTİTY $ SVG.XLinkEmbed.extra.attrib "" s 


€lENTIİTY $ SVG.XLinkEmbed.attrib 
"ŞXLINK.xmlns.attrib, 
55XLINK.pfx,type ( simple ) £FIXED "simple" 
"5XLINK. pfx,href S5SURT.datatype, “2£REQUTRED 
S5XLINK. pfx, role SSUR1.datatype, £1MPLIED 
"5XLINK.pfx,şarcrole S5UR1.datatype, 25TIMPLİED 
5XLINK.pfx,title CDATA £TMPLİED 
S5XLINK. pfx, shovv ( embed ) "embed" 
S5XLINK. pfxşactuate ( onLoad ) £FIXED "onLoad" 
358VG.XLinkEmbed.extra.attrib," 
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z 
€IENTİTY $ SVG.XLinkReplace.extra.attrib "" s 


€IENTİTY $ SVG.XLinkReplace.attrib 
"ŞXLINK.xmlns.attrib, 
55XLINK.pfx,type ( simple ) £FIXED "simple" 
S5XLINK. pfx,href S5.URT.datatype, “2£REQUTRED 
S5XLINK. pfx, role S.UR1.datatype, £1MPLIED 
"5XLINK.pfx,şarcrole S5UR1.datatype, 25TMPLIED 
5XLINK.pfx,title CDATA £FTMPLİED 
S5XLINK. pfx, shov ( nev 1 replace ) "replace" 
S5XLINK. pfx,actuate ( onRequest ) £FIXED "onRequest" 
358VG.XLinkReplace.extra.attrib," 





z 


c1-- end of svg-xlink-attrib.mod --s5 


A.3.16 External Resources Attribute Module 


"The External Resources Attribute Module defines the External.attrib attribute collection. 





c1-- file: svg-extresources-attrib.mod 


This is SVG, a language for describing tvo-dimensional graphics in XML. 

Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), ATI Rights Reserved. 

Revision: $1d: svg-extresources-attrib.mod,v 1.2 2011/07/08 03:18:58 cmccorma Exp $ 
This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//M3C//ENTITIES SVG 1.1 External Resources Attribute//EN" 
SYSTEM "http: / /uvv/.vV3.org/Graphics/SVG/1.1/DTD/svg-extresources-attrib.mod" 


c1-- External Resources Attribute 
externalResourcesRequired 


This module defines the External attribute set. 
--- 


€lENTİTY 55 SVG.externalResourcesRequired.attrib 
"externalResourcesRequired 5:Boolean.datatype, £1MPLTED" 
z 


€lENTİTY $ SVG.External.extra.attrib "" s 
€lENTİTY $ SVG.External.attrib 


"SSVG.externalResourcesRequired.attrib, 
358VG.External.extra.attrib," 


c1-- end of svg-extresources-attrib.mod --5 


A.3.17 Structure Module 
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"The Structure Module defines the Description.class, Structure.class and Use.class element collections. 


Collection name Elements in collection 
Description.class İ desc, title, metadata 


se 
Structure.class İsvg, g, defs, symbol, Use.class 


€1-- file: svg-structure.mod 





This is SVG, a language for describing tvo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), ALL Rights Reserved. 
Revision: $1d: svg-structure.mod,v 1.5 2011/07/08 03:18:59 cmccorma Exp $ 
This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//3C/ /ELEMENTS SVG 1.1 Structure//EN" 
SYSTEM "http: / /vvv/.v/3.org/Graphics/SVG/1.1/DTD/svg-structure.mod" 


c1-- Structure 
svg, g, defs, desc, title, metadata, symbol, use 


This module declares the maflor structural elements and their attributes. 


--- 
c1-- Qualified Names (Default) ......................... 5 
€ ENTİTY 55 SVG.svg.qname "svg" s 

€ENTİTY 55 SVG.g.qname "g" xs 

€ENTİTY 55 SVG.deTs.qname "defs" s 

€ ENTİTY 55 SVG.desc.qname "desc" 5 

€IENTİTY $ SVG.title.qname "title" s 

€ENTİTY 55 SVG.metadata.qname "metadata" x 

€1ENTİTY 55 SVG.symbol.qname "symbol" 5 

€ENTİTY 55 SVG.use.qname "use" s 

c1-- Attribute Collections (Default) ................... --- 
€IENTİTY 55 SVG.Core.attrib "" s 

€lENTİTY $ SVG.Container.attrib "" s 

€IENTİTY $ SVG.Conditional.attrib "" s 

€lENTİTY $ SVG.Style.attrib "" s 

€IENTİTY $ SVG.Vievport.attrib "" 

€lENTİTY $ SVG.Text.attrib "" s 

€IENTİTY $ SVG.TextContent.attrib "" s 

€lENTİTY $ SVG.Font.attrib "" s 

€lENTİTY $ SVG.Paint.attrib "" s 

€lENTİTY 55 SVG.Color.attrib "" s 

€IENTİTY $ SVG.Üpacity.attrib "" s 

€IENTİTY 55 SVG.Graphics.attrib "" 

€lENTİTY 55 SVG.Marker.attrib "" s 

€lENTİTY $ SVG.ColorProfile.attrib "" s 

€IENTITY $ SVG.Gradient.attrib "" 

€IENTİTY $ SVG.Clip.attrib "" s 

€IENTİTY 55 SVG.Mask.attrib "" s 

€lENTİTY $ SVG.Filter.attrib "" s 

€IENTİTY $ SVG.FilterColor.attrib "" s 
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€ENTİTY 55 SVG.DocumentEvents.at 
€lENTİTY 55 SVG.GraphicalEvents.a 
€IENTİTY $ SVG.Cursor.attrib "" 

€lENTİTY $ SVG.XLinkEmbed.attrib 
€lENTİTY $ SVG.External.attrib " 


c1-- SVG.Description.class ..... 
€lENTIİTY $ SVG.Description.extra 
€lENTİTY $ SVG.Description.class 

"S5SVG.desc.qname, 1 Ss8VG.tit 


555VG.Description.extra.clas 
z 


c1-- SVG.Use.class ............. 
€lENTİTY 55 SVG.Use.extra.class " 
€1ENTİTY 55 SVG.Use.class 
"1 S5SVG.use . qname, S:SVG.Use. 
z 
c1-- SVG.Structure.class ....... 
€lENTİTY 55 SVG.Structure.extra.c 
€ENTİTY 55 SVG.Structure.class 
"1 S5SVG.svg .qname, 1 5:5VG.g. 
555VG.Use.. class, S5SVG.Stru 


z 


c1-- SVG.Presentation.attrib ... 


trib ""s 
ttrib ""s 
rə 

hü 

". 


"class ""s 


1e.qname, 1 S:SVG.metadata .qname, 


s," 


". 


extra.class," 


lass ""s 


qname, 1 35:5VG.deTs.qname, 1 555VG.symbol.qname , 
cture.extra.class," 


€lENTİTY $ SVG.Presentation.extra.attrib "" s 


€IENTİTY $ SVG.Presentation.attrib 


"SSVG.Container.attrib, 
358VG.Vieuvport.attrib, 
958VG.Text.attrib, 
358VG.TextContent.attrib, 
358VG.Font.attrib, 
9558VG.Paint.attrib, 
558VG.Color.attrib, 
555VG.Opacity.attrib, 
358VG.Graphics.attrib, 
558VG.Marker.attrib, 
358VG.ColorProfile.attrib, 
S58VG.Gradient.attrib, 
9558VG.Clip.attrib, 
555VG.Mask.attrib, 
S58VG.Filter.attrib, 
358V6.FilterColor.attrib, 
555VG.Cursor.attrib, 
T1ood-color SsSVGColor.data 
T1ood-opacity 5s0pacityValue 
lighting-color S5SVGColor.da 
555VG.Presentation.extra.at 
z 


xc1-- svg: SVG Document Element 


€lENTİTY 55 SVG.svg.extra.conten 


ype: 2£IMPLIED 
.datatype, £1MPLTED 
tatype, £F1MPLIED 
rib," 





.... 


€VENTİTY 55 SVG.svg.element "İNCLUDE" 5 


cl S5SVG. svg element, 1 
€ENTİTY 55 SVG.svg.content 
"( S5SVG.Description.class, 





958VG.Animation. class, S:SVG.Structure.class, 


555VG.Conditional.class, S:SVG.TImage. class, 55SVG.Style.class, 


35SVG. Shape . class, S:SVG.Te 
555VG.ColorProfile.class, 
555VG.Clip.class, S5SVG.Mas 


xt.class, S:SVG.Marker.class, 
35SVG.Gradient.class, $5SVG.Pattern.class, 
k.class, S5SVG.Filter.class, S5SVG.Cursor.class, 


35SVG.Hyperlink.class, 3:SVG.Viev. class, 358VG.Script.class, 


55SVG.Font.class, S55VG.Ext 
z 


c ELEMENT 55SVG. svg..qname, S5SVG. s 
c1-- end of SVG.svg.element --s1 


ensibility.class, 5S:SVG.svg.extra.content, )”" 


vg.content, xs 
1” 
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€lENTİTY $ SVG.svg.attlist "INCLUDE" 5 
cl S58VG.svg.attlist,l 
€ ATTLIST 55SVG. svg.qname 
S5SVG.xmlns.attrib, 
S5SVG.Core.attrib, 
S5SVG.Conditional.attrib, 
SSVG.Style.attrib, 
S58VG.Presentation.attrib, 
958VG.DocumentEvents.attrib, 
S5SVG.GraphicalEvents.attrib, 
S5SVG.External.attrib, 
x ssCoordinate.datatype, £IMPLIED 
y ssCoordinate.datatype, £IMPLIED 
vidth "sLength.datatype, £1MPLTED 
height s:Length.datatype, £1MPLTED 
vievBox SsVievBoxSpec.datatype, “£T1MPLIED 
preserveAspectRatio 5:PreserveAspectRatioSpec.datatype, "xMidYMid meet" 
zoomAndPan ( disable / magnify ) "magnify" 
version s:Number.datatype, £FFIXED "1.1" 
baseProfile "“Text.datatype, “"TMPLIED 
contentScriptType 5:ContentType.datatype, "application/ecmascript" 
contentStyleType 5:ContentType.datatype, "text/css" 
z 
c1-- end of SVG.svg.attlist --s115 


qlz gi: Group: Element dəəə əə saa os yada s sa sbəb aş --- 
€VENTİTY 55 SVG.g.extra. content "" s 


€1ENTİTY 55 SVG.g.element "İNCLUDE" 5 

cl 155VG.g element, 1 

€ENTİTY 55 SVG.g.content 

"( S5SVG.Description.class, 1 S58VG.Animation.class, 5S5SVG.Structure.class, 

555VG.Conditional.class, S:SVG.Tmage. class, 555VG.Style.class, 
35SVG.Shape.. class, S5SVG. Text. class, SSVG.Marker.class, 
35SVG.ColorProfile. class, S5:SVG.Gradient.class, 55SVG.Pattern.class, 
358VG.Clip.class, 3:5VG.Mask.class, 355VG.Filter.class, S5SVG.Cursor.class, 
35SVG.Hyperlink. class, S:SVG.Viev. class, S58VG.Seript.class, 
558VG.Font.class, 958VG.Extensibility.class, S5SVG.g.extra.content, )“" 

.. 

c ELEMENT 5“:SVG.g .qname, S55VG.g content, x 

xc1-- end of SVG.g.element --z115 


€lENTİTY $ SVG.g.attlist "INCLUDE" 5 

cl 1S58VG.g.attlist,l 

€ ATTLIST S:SVG.g .qname, 
S58VG.Core.attrib, 
S5SVG.Conditional.attrib, 
S5SVG.Style.attrib, 
S58VG.Presentation.attrib, 
S58VG.GraphicalEvents.attrib, 
S5SVG.External.attrib, 
transform S:TransformList.datatype, £1MPLTED 

- 

xc1-- end of SVG.g.attlist --s115 


c1-- defs: Definisions Element .. 





€lENTİTY 55 SVG.defs.extra.content "" s 


€lENTİTY 55 SVG.defs.element "INCLUDE" x 

cl İS5SVG.defs.element, 1 

€lENTİTY 55 SVG.defs.content 

"( S5SVG.Description.class, 1 S58VG.Animation.class, 5S5SVG.Structure.class, 

555VG.Conditional.class, S:SVG.TImage. class, 55SVG.Style.class, 
35SVG .Shape .class, S5SVG. Text.class, S5SVG.Marker.class, 
S5SVG.ColorProfile. class, S5:SVG.Gradient.class, 55SVG.Pattern.class, 
358VG.Clip.class, 3:5VG.Mask.class, 3558VG.Filter.class, S:SVG.Cursor.class, 
555VG.Hyperlink.class, 5S:SVG.Viev.class, S58VG.Secript.class, 
358VG.Font.class, 958VG.Extensibility.class, S5SVG.defTs.extra.content, )”" 

z 

€ ELEMENT S:SVG.deTs .qname , S55VG.defs. content, x 

c1-- end of SVG.defs.element --x11 


€IENTİTY $ SVG.defs.attlist "INCLUDE" x 
cl İ85SVG.defs.attlist,l 
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€ ATTLIST S5SVG.deTs . qname , 
S5SVG.Core.attrib, 
S58VG.Conditional.attrib, 
S5SV6G.Style.attrib, 
S58VG.Presentation.attrib, 
S5SVG.GraphicalEvents.attrib, 
S5SVG.External.attrib, 
transform S:TransformList.datatype, £1MPLTED 
z 
c1-- end of SVG.defs.attlist --s11- 


c1-- desc: Description Element .. 





€IENTİTY 55 SVG.desc.extra. content "" s 


€VENTİTY 55 SVG.desc.element "INCLUDE" x 
cl İS5SVG.desc.element, 1 
€ENTİTY 55 SVG.desc.content 
"( £5PCDATA SsSVG.desc.extra.content, )”" 
z 
e ELEMENT 5:SVG..desc.qname, 5:5VG.desc. content, s 
xc1-- end of SVG.desc.element --s115 


€IENTİTY $ SVG.desc.attlist "INCLUDE" x 

cl İ85SVG.desc.attlist,l 

€ ATTLIST S5SVG.desc.. qname , 
S5SVG.Core.attrib, 
S58VG.Style.attrib, 

z 

c1-- end of SVG.desc.attlist --s11- 


e1-- title: Title Element .............................. --5 
€IENTİTY $ SVG.title.extra.content "" s 


€lENTİTY $ SVG.title.element "INCLUDE" 5 
cl İ85SVG.title.element, 1 
€IENTİTY $ SVG.title.content 
"( £PCDATA SSVG.title.extra.content, )“" 
z 
€ ELEMENT 5S:8VG.title.qname, S55VG.title.content, x 
c1-- end of SVG.title.element --x11- 


€IENTİTY $ SVG.title.attlist "INCLUDE" 5 
ciİsSVG.title.attlist,1 
€1ATTLIST S:SVG.title .qname, 
S5SVG.Core.attrib, 
S58VG.Style.attrib, 
- 
c€1-- end of SVG.title.attlist --s11- 


c1-- metadata: Metadata Element ........................ 85 
€ENTİTY 55 SVG.metadata.extra. content "" s 


€1ENTİTY 55 SVG.metadata.element "INCLUDE" 5 
cl f55SVG.metadata .element, 1 
€lENTİTY 55 SVG.metadata.content 
"( 35PCDATA S:SVG.metadata.extra.content, )“" 
z 
€ ELEMENT 5:SVG ..metadata .qname, S:SVG .metadata. content, x 
c1-- end of SVG.metadata.element --s11- 


€lENTİTY $ SVG.metadata.attlist "INCLUDE" 5 

cl İ55SVG.metadata.attlist,1 

€ ATTLIST S:SVG ..metadata .qname , 
S5SVG.Core.attrib, 

z 

c1-- end of SVG.metadata.attlist --s11- 


c1-- symbol: Symbol Element ............................ -- 
€ENTİTY 55 SVG.symbol.extra. content "" s 
€1ENTİTY 55 SVG.symbol.element "İNCLUDE" x 


el İ55SVG. symbol. element, 
€1ENTİTY 55 SVG.symbol.content 


"( S5SVG.Description.class, 1 S5:8VG.Animation.class, 5S5SVG.Structure.class, 

555VG.Conditional.class, S:SVG.Tmage. class, 55SVG.Style.class, 
35SVG.Shape.. class, S5SVG.Text.class, S5SVG.Marker.class, 
S5SVG.ColorProfile. class, S5:SVG.Gradient.class, 55SVG.Pattern.class, 
358VG.Clip.class, 3:5VG.Mask.class, 3558VG.Filter.class, S:SVG.Cursor.class, 
555VG.Hyperlink.class, 5S:SVG.Viev.class, S58VG.Secript.class, 
555VG.Font.class, $55VG.Extensibility.class, 5:SVG.symbo1.extra.content, )”" 

z 

e ELEMENT 55SVG. symbol1.qname, S:SVG.symbol. content, 5 

c1-- end of SVG.symbo1.element --x115 
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€lENTİTY $ SVG.symbol.attlist "INCLUDE" x 

el İ55SVG. symbol.attlist,1 

€ ATTLIST 55SVG.symbol.qname, 
S58VG.Core.attrib, 
S5SVG.Style.attrib, 
S58VG.Presentation.attrib, 
S5SVG.GraphicalEvents.attrib, 
S5SVG.External.attrib, 
vievBox SsVievBoxSpec.datatype, £IMPLIED 
preserveAspectRatio 5:PreserveAspectRatioSpec.datatype, "xMidYMid meet" 

- 

c1-- end of SVG.symbol.attlist --s11- 





e1-- use: Use Element .................................. --- 
€ENTİTY 55 SVG.use.extra. content "" s 


€VENTİTY 55 SVG.use.element "İNCLUDE" 5 
cl İS5SVG.use element”, 1 
€ENTİTY 55 SVG.use. content 
"( S5SVG.Description.class, 1 5S:8VG.Animation.class, 
S5SVG.use.extra.content, )”" 
z 
€ ELEMENT S:SVG.use. qname, S5SVG.use. content, x 
c1-- end of SVG.use.element --s115 


€IENTİTY $ SVG.use.attlist "INCLUDE" 5 

cl İSSVG.use.attlist,1 

€ ATTLIST S:SVG.use .qname, 
S5SVG.Core.attrib, 
S5SVG.Conditional.attrib, 
S5SVG.Style.attrib, 
S58VG.Presentation.attrib, 
S5SVG.GraphicalEvents.attrib, 
S5SVG.XLinkEmbed.attrib, 
S5SVG.External.attrib, 
x SseCoordinate.datatype, £IMPLIED 
y sseCoordinate.datatype, £1IMPLIED 
vidth "sLength.datatype, £1MPLTED 
height ssLength.datatype, £1MPLTED 
transform S:TransformList.datatype, £1MPLTED 

z 

c1-- end of SVG.use.attlist --s115 


c1-- end of svg-structure.mod --x 


A.3.18 Basic Structure Module 


"The Basic Structure Module defines the Description.class, Structure.class and Use.class element collections. 








€1-- file: svg-basic-structure.mod 


This is SVG, a language for describing tvo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), ATLI Rights Reserved. 
Revision: $1d: svg-basic-structure.mod,v 1.4 2011/07/08 03:18:58 cmccorma Exp $ 
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This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//MN3C//ELEMENTS SVG 1.1 Basic Structure//EN" 
SYSTEM "http: / /vvv/.v/3.org/Graphics/SVG/1.1/DTD/svg-basic-structure.mod" 


c1-- Basic Structure 
svg, g, defs, desc, title, metadata, use 


This module declares the maflor structural elements and their attributes. 








--- 
c1-- Qualified Names (Default) ......................... --5 
€ ENTİTY 55 SVG.svg.qname "svg" s 

€1ENTİTY 55 SVG.g.qname "g" s 

€ENTİTY 55 SVG.defTs.qname "defs" 5 

€VENTİTY 55 SVG.desc.qname "desc" s 

€IENTİTY $ SVG.title.qname "title" xs 

€IENTİTY 55 SVG.metadata.qname "metadata" x 

€ENTİTY 55 SVG.use.qname "use" s 

c1-- Attribute Collections (Default) ................... --- 
€lENTİTY 5 SVG.Core.attrib "" s 

€IENTİTY $ SVG.Container.attrib "" 

€lENTİTY $ SVG.Conditional.attrib "" s 

€lENTİTY $ SVG.Style.attrib "" s 

€IENTİTY $ SVG.Vievport.attrib "" s 

€IENTİTY $ SVG.Text.attrib "" s 

€IENTİTY $ SVG.TextContent.attrib "" s 

€lENTİTY $ SVG.Font.attrib "" s 

€IENTİTY $ SVG.Paint.attrib "" s 

€IENTİTY 55 SVG.Color.attrib "" s 

€IENTİTY $ SVG.Üpacity.attrib "" s 

€IENTİTY 55 SVG.Graphics.attrib "" 

€lENTİTY 55 SVG.Marker.attrib "" s 

€IENTİTY $ SVG.ColorProfile.attrib "" s 

€IENTİTY $ SVG.Gradient.attrib "" 

€IENTİTY $ SVG.Clip.attrib "" s 

€IENTİTY 55 SVG.Mask.attrib "" s 

€lENTİTY $ SVG.Filter.attrib "" s 

€IENTİTY $ SVG.FilterColor.attrib "" s 

€IENTİTY 55 SVG.DocumentEvents.attrib "" 

€IENTİTY 55 SVG.GraphicalEvents.attrib "" s 

€lENTİTY 55 SVG.Cursor.attrib "" s 

€IENTITY $ SVG.XLinkEmbed.attrib "" s 

€IENTİTY 5 SVG.External.attrib "" s 

c1-- SVG.Description.class ............................. --- 


€lENTİTY 55 SVG.Description.extra.class "" s 
€lENTİTY 55 SVG.Description.class 
"S5SVG.desc.qname, 1 S58VG.title.qname, 1 S5SVG.metadata .qname, 


358VG.Description.extra.class," 
z 


siL-z “SVG.Üse.classı sua mı saba sağdı RAR Da Rusbasabdsn -- 
€IENTİTY 55 SVG.Use.extra.class "" s 
€ENTİTY 55 SVG.Use.class 

"1 S5SVG.use .qname, S:SVG.Use.extra.class," 


z 


e1-- SVG.Structure.class ............................... --- 
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€lENTİTY 55 SVG.Structure.extra.class "" 


€lENTİTY 55 SVG.Structure.class 


z 


"1 S5SVG.g.qname, 1 S5SVG.deTs.qname, S5SVG.Use.class, 
358VG.Structure .extra.class," 


€1-- SVG.Presentation.attrib ........................... --- 


€IENTİTY $ SVG.Presentation.extra.attrib "" s 


€lENTİTY $ SVG.Presentation.attrib 


"SSVG.Container.attrib, 
S58VG.Vieuvport.attrib, 

9558VG.Text.attrib, 
558VG.TextContent.attrib, 
358VG.Font.attrib, 

958VG.Paint.attrib, 

358VG.Color.attrib, 

555VG.Opacity.attrib, 
358VG.Graphics.attrib, 
558VG.Marker.attrib, 
358VG.ColorProfile.attrib, 
358VG.Gradient.attrib, 

358V6.Clip.attrib, 

555VG.Mask.attrib, 

S58VG.Filter.attrib, 
358VG.FilterColor.attrib, 
558VG.Cursor.attrib, 

T1ood-color 5sSVGColor.datatype, £1MPLIED 
T1ood-opacity 5$s0pacityValue.datatype, £T1MPLTED 
lighting-color s5SVGColor.datatype, £TMPLTED 
358VG.Presentation.extra.attrib," 


z 
c1-- svg: SVG Document Element ......................... --5 
€lENTİTY 55 SVG.svg.extra.content "" s 


€VENTİTY 55 SVG.svg.element "İNCLUDE" 5 


cl S5SVG. svg..element, 1 
€ENTİTY 55 SVG.svg.content 


z 





"( S5SVG.Description.class, 358VG.Animation. class, S:SVG.Structure.class, 
555VG.Conditional.class, S:SVG.TImage. class, 55SVG.Style.class, 
35S8VG.Shape..class, S5SVG. Text.class, S5SVG.Marker.class, 
35SVG.ColorProfile. class, S5SVG.Gradient.class, 55SVG.Pattern.class, 
358VG.Clip.class, 3:58VG.Mask.class, 3558VG.Filter.class, S:SVG.Cursor.class, 
55SVG.Hyperlink. class, S:SVG.Viev. class, S58VG.Script.class, 
558VG.Font.class, 958VG.Extensibility.class, SSVG.svg.extra.content, )”" 


ce ELEMENT 5SVG. svg..qname, S5SVG.svg.content, s 
xc1-- end of SVG.svg.element --s115 


€1ENTITY $ SVG.svg.attlist "INCLUDE" 5 
ce TSSVG.svg.attlist:1 
€ ATTLIST 5S5SVG. svg.qname, 


z 


S5SVG.xmlns.attrib, 

S5SVG.Core.attrib, 

S5SVG.Conditional.attrib, 
S58VG.Style.attrib, 
S58VG.Presentation.attrib, 
S58VG.DocumentEvents.attrib, 
S58VG.GraphicalEvents.attrib, 
S5SVG.External.attrib, 

x 55Coordinate.datatype, £IMPLTED 

y s:Coordinate.datatype, £TIMPLTED 

vidth "sLength.datatype, £T1MPLTED 

height s:Length.datatype, £1MPLTED 

vievBox SsVievBoxSpec.datatype, £IMPLIED 
preserveAspectRatio 5:PreserveAspectRatioSpec.datatype, "xMidYMid meet" 
zoomAndPan ( disable / magnify ) "magnify" 
version s:Number.datatype, ZFFIXED "1.1" 
baseProfile "““Text.datatype, “"IMPLIED 


c1-- end of SVG.svg.attlist --s115 
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sel-- gb Group: Element: iLə əə sas yasa ba Ra səsə dd --- 
€ENTİTY 55 SVG.g.extra.content "" s 


€ENTİTY 55 SVG.g.element "İNCLUDE" 5 

cl 1S55VG.g element, 1 

€ENTİTY 55 SVG.g.content 

"( S5SVG.Description.class, 1 S5:8VG.Animation.class, 5S5SVG.Structure.class, 

555VG.Conditional.class, S:SVG.Tmage. class, 55SVG.Style.class, 
35SVG ..Shape. class, S5SVG.Text.class, S5SVG.Marker.class, 
35SVG.ColorProfile. class, S5:SVG.Gradient.class, 55SVG.Pattern.class, 
358VG.Clip.class, 3:5VG.Mask.class, 3558VG.Filter.class, S:SVG.Cursor.class, 
555VG..Hyperlink.class, 5S:SVG.Viev.class, S58VG.Secript.class, 
558VG.Font.class, 958VG.Extensibility.class, S5SVG.g.extra.content, )“" 

z 

€ ELEMENT 5“:SVG.g ..qname, S55VG.g content, x 

x1-- end of SVG.g.element --s115 


€lENTİTY $ SVG.g.attlist "INCLUDE" 5 

cl 1S58VG.g.attlist,l 

€ ATTLIST 5:SVG.g .qname, 
S5SVG.Core.attrib, 
S5SVG.Conditional.attrib, 
S58VG.Style.attrib, 
S58VG.Presentation.attrib, 
S58VG.GraphicalEvents.attrib, 
S5SVG.External.attrib, 
transform 5:TransformList.datatype, £1MPLTED 

z 

c1-- end of SVG.g.attlist --s115 


c1-- defs: Definisions Element ......................... -- 
€ VENTİTY 5. SVG.defs.extra. content "" s 


€IENTİTY 55 SVG.defs.element "INCLUDE" 5 

el İS5SVG.defTs.element, 1 

€lENTİTY 55 SVG.defs.content 

"( S5SVG.Description.class, 1 S58VG.Animation.class, 5S5SVG.Structure.class, 

555VG.Conditional.class, S:SVG.TImage. class, 55SVG.Style.class, 
35SVG.Shape .class, S5SVG.Text.class, SSVG.Marker.class, 
35SVG.ColorProfile. class, S5:SVG.Gradient.class, 55SVG.Pattern.class, 
358VG.Clip.class, 3:58VG.Mask.class, 355VG.Filter.class, S:SVG.Cursor.class, 
35SVG.Hyperlink. class, 3:SVG.Viev. class, S58VG.Script.class, 
358VG.Font.class, 958VG.Extensibility.class, S5SVG.defTs.extra.content, )”" 

z 

e ELEMENT 5:SVG..deTs .qname, 5S:5SVG.defs.content, xs 

c1-- end of SVG.defs.element --x11- 


€lENTİTY $ SVG.defs.attlist "INCLUDE" x 

cl İ8SSVG.defs.attlist,l 

€ ATTLIST S:SVG.deTs . qname , 
S58VG.Core.attrib, 
S5VG.Conditional.attrib, 
S5SVG.Style.attrib, 
9658VG.Presentation.attrib, 
S5SVG.GraphicalEvents.attrib, 
S5SVG.External.attrib, 
transform S:TransformList.datatype, £1MPLTED 

- 

c1-- end of SVG.defs.attlist --sll- 


c1-- desc: Description Element ......................... --- 
€VENTİTY 55 SVG.desc.extra. content "" s 

€IENTİTY 55 SVG.desc.element "IİNCLUDE" x 

el İS5SVG.desc.element, 1 


€lENTİTY 55 SVG.desc.content 
"( 2£PCDATA SsSVG.desc.extra.content, )“" 


z 
c ELEMENT 5:SVG .desc ..qname, S55VG.desc. content, xs 
c1-- end of SVG.desc.element --x115 


€IENTİTY $ SVG.desc.attlist "INCLUDE" x 
cl İ85SVG.desc.attlist,l 
€ ATTLIST S5SVG.desc .. qname , 


S5SVG.Core.attrib, 
S5SVG.Style.attrib, 
z 


c1-- end of SVG.desc.attlist --s11- 
e1-- title: Title Element .............................. --5 


€IENTİTY $ SVG.title.extra.content "" s 
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€lENTİTY $ SVG.title.element "INCLUDE" 5 
ce İ85SVG.title.element, 1 
€lENTİTY $ SVG.title.content 
"( S£PCDATA SSVG.title.extra.content, )“" 
z 
€ ELEMENT 5:8VG.title.qname, S55VG.title.content, x 
c1-- end of SVG.title.element --x11- 


€lENTİTY $ SVG.title.attlist "INCLUDE" 5 
ciİSSVG.title.attlist,1 
€1ATTLIST S:SVG.title .qname, 
S5SVG.Core.attrib, 
S5SVG.Style.attrib, 
z 
c1-- end of SVG.title.attlist --s11- 





c1-- metadata: Metadata Element ........................ --- 
€IENTİTY 55 SVG.metadata.extra. content "" s 


€1ENTİTY 55 SVG.metadata.element "INCLUDE" 5 
cl İS5SVG .metadata .element, 1 
€lENTİTY 55 SVG.metadata.content 
"( 35PCDATA S:SVG.metadata.extra.content, )“" 
z 
e ELEMENT 5:SVG .metadata .qname, “:SVG .metadata. content, x 
c1-- end of SVG.metadata.element --s11s 


€lENTİTY $ SVG.metadata.attlist "INCLUDE" 5 

cl İS5SVG.metadata.attlist,1 

€ ATTLIST S5SVG .metadata .qname , 
S5SVG.Core.attrib, 

z 

c1-- end of SVG.metadata.attlist --s11- 


c1-- use: Use Element 





€lENTİTY 55 SVG.use.extra. content "" s 


€VENTİTY 55 SVG.use.element "İNCLUDE" 5 
cl İS5SVG.use element”, 1 
€1ENTİTY 55 SVG.use. content 
"( S5SVG.Description.class, 1 55:8VG.Animation.class, 
S5SVG.use.extra.content, )”" 
z 
ce ELEMENT “5SVG..use.qname, S5SVG.use. content, s 
c1-- end of SVG.use.element --s115 


€IlENTİTY $ SVG.use.attlist "INCLUDE" 5 

cl İSSVG.use.attlist,1 

€ 1ATTLIST S5SVG.use .qname, 
S58VG.Core.attrib, 
S5SVG.Conditional.attrib, 
S58VG.Style.attrib, 
S58VG.Presentation.attrib, 
S58VG.GraphicalEvents.attrib, 
S58VG.XLinkEmbed.attrib, 
S5SVG.External.attrib, 
x 55Coordinate.datatype, £IMPLTED 
y “:Coordinate.datatype, £TIMPLTIED 
vidth "sLength.datatype, £1MPLIED 
height ss:Length.datatype, £1MPLTED 
transform 5:TransformList.datatype, £T1MPLTED 

z 

c1-- end of SVG.use.attlist --slls 


c1-- end of svg-basic-structure.mod --5 


A.3.19 Conditional Processing Module 


"The Conditional Processing Module defines the Conditional.class element collection and the Conditional.attrib at- 
tribute collection. 


Collection name İ Elements in collection 
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Collection name Attributes in collection 
Conditional.attrib İ requiredFeatures, requiredExtensions, systemLanguage 


2527777707”. ” --- 
c€1-- SVG 1.1 Conditional Processing Module ................................. --- 
c1-- file: svg-conditional.mod 





This is SVG, a language for describing tuvo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), All Rights Reserved. 
Revision: $I1d: svg-conditional.mod,v 1.3 2011/07/08 03:18:58 cmccorma Exp $ 


This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//3C//ELEMENTS SVG 1.1 Conditional Processing/ /EN" 
SYSTEM "http: / /vvvv..V3.org/Graphics/SVG/1.1/DTD/svg-conditional.mod" 


c1-- Conditional Processing 
svitch 


This module declares markup to provide support for conditional processing. 
--- 


c1-- extension list specification --c 
€lENTİTY $ ExtensionList.datatype "CDATA" 5 


c1-- feature list specification --x 
€lENTİTY $ FeatureList.datatype "CDATA" x 


c1-- Qualified Names (Default) ......................... --5 
€1ENTİTY $ SVG.svitch.qname "svitch" x 
c1-- Attribute Collections (Default) ................... --- 


€lENTİTY 
€lENTİTY 
€IENTİTY 
€lENTİTY 
€lENTİTY 
€IENTİTY 
€IENTİTY 
€lENTİTY 
€lENTİTY 
€lENTİTY 
€lENTİTY 
€lENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€lENTİTY 
€lENTİTY 
€IENTİTY 
€lENTİTY 
€lENTİTY 


SVG.Core.attrib "" s 
SVG.Container.attrib "" 5 
SVG.Style.attrib "" s 
SVG.Vievport.attrib "" s 
SVG.Text.attrib "" s 
SVG.TextContent.attrib "" s 
SVG.Font.attrib "" s 
SVG.Paint.attrib "" 5 
SVG.Color.attrib "" s 
SVG.Opacity.attrib "" 
SVG.Graphics.attrib "" s 
SVG.Marker.attrib "" s 
SVG.ColorProfile.attrib "" s 
SVG.Gradient.attrib "" s 
SVG.Clip.attrib "" 
SVG.Mask.attrib "" s 
SVG.Filter.attrib "" 
SVG.FilterColor.attrib "" s 
SVG.GraphicalEvents.attrib "" s 
SVG.Cursor.attrib "" s 


9? 99 9? o? 9? Ə? 9? 0? 0? 0? ÖP ÖP Ə? 0? 0? 0? ÖP o? o? op 
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€IENTİTY $ SVG.External.attrib "" 
e€1-- SVG.Conditional.class ............................. -- 
€IENTİTY $ SVG.Conditional.extra.class "" s 


€1ENTİTY $ SVG.Conditional.class 
"1 SSVG.svitch.qname, S5:SVG.Conditional.extra.class," 
z 


e1-- SVG.Conditional.attrib ............................ --- 
€IENTİTY $ SVG.Conditional.extra.attrib "" s 


€lENTİTY $ SVG.Conditional.attrib 
"requiredFeatures “sFeatureList.datatype, £IMPLTIED 
requiredExtensions $5ExtensionList.datatype, £1MPLIED 
systemLanguage “sLanguageCodes .datatype, ZTMPLTED 
358VG.Conditional.extra.attrib," 

- 


€1-- SVG.Presentation.attrib ........................... --- 
€lENTİTY $ SVG.Presentation.extra.attrib "" s 


€IENTİTY $ SVG.Presentation.attrib 
"SSVG.Container.attrib, 
358VG.Vieuvport.attrib, 
555VG.Text.attrib, 
958VG.TextContent.attrib, 
358VG.Font.attrib, 
958V6.Paint.attrib, 
558VG.Color.attrib, 
555VG.Opacity.attrib, 
358VG.Graphics.attrib, 
358VG.Marker.attrib, 
358VG.ColorProfile.attrib, 
358VG.Gradient.attrib, 
9358V6G.Clip.attrib, 
558VG.Mask.attrib, 
S58VG.Filter.attrib, 
358VG.FilterColor.attrib, 
358VG.Cursor.attrib, 
T1ood-color ssSVGColor.datatype, £IMPLIED 
T1ood-opacity 5$s0pacityValue.datatype, £T1MPLTED 
lighting-color s5SVGColor.datatype, £TMPLTED 
358VG.Presentation.extra.attrib," 

z 


c€1-- suvitch: Svitch Element ............................ --- 
€lENTİTY $ SVG.svitch.extra.content "" s 


€lENTİTY $ SVG.svitch.element "INCLUDE" x 

c1İ85SVG.svitch.element, 1 

€lENTİTY $ SVG.svitch.content 
"( S5SVG.Description.class, 555VG.svg.qname, 1 5:SVG.g.qname, 

İ “5SVG.use.qname, 1 S55VG. text.qname, 1 S55VG.Animation.class, 
555VG.Conditional.class, S:SVG.Tmage. class, 55SVG.Shape class, 
555VG.Hyperlink.class, S58VG.Extensibility.class, 
S58VG.svitch.extra.content, )”" 

z 
€ ELEMENT 5:SVG.svitch.qname, S:5VG.svitch.content, 5 
c1-- end of SVG.suvitch.element --s115 





€lENTİTY $ SVG.svitch.attlist "INCLUDE" x 

c1İ8SVG.svitch.attlist,1 

€ 1ATTLIST S5SVG.svitch .qname, 
S5SVG.Core.attrib, 
SVG.Conditional.attrib, 
S5SVG.Style.attrib, 
S658VG.Presentation.attrib, 
S58VG.GraphicalEvents.attrib, 
S5SVG.External.attrib, 
transform S:TransformList.datatype, £1MPLTED 

z 

c1-- end of SVG.suvitch.attlist --s115 


c1-- end of svg-conditional.mod --x 


A.3.20 lmage Module 
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The Image Module defines the Tmage.class element collection. 


Collection name İ Elements in collection 





c1-- file: svg-image.mod 


This is SVG, a language for describing tvo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), ALL Rights Reserved. 
Revision: $1d: svg-image.mod,v 1.4 2011/07/08 03:18:59 cmccorma Exp $ 





This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//3C//ELEMENTS SVG 1.1 Image//EN" 
SYSTEM "http: / /vvv..vV3.org/Graphics/SVG/1.1/DTD/svg-image.mod" 


c1-- Image 


This module declares markup to provide support for image. 
--- 


c1-- Qualified Names (Default) ......................... --- 


€lENTİTY 55 SVG.image.qname "image" x 


c1-- Attribute Collections (Default) ................... --- 
€IENTİTY 55 SVG.Core.attrib "" s 

€IENTİTY $ SVG.Conditional.attrib "" s 

€lENTİTY $ SVG.Style.attrib "" s 

€IENTİTY $ SVG.Vievport.attrib "" 

€lENTİTY 55 SVG.Color.attrib "" s 

€IENTİTY $ SVG.Üpacity.attrib "" s 

€IENTİTY 5 SVG.Graphics.attrib "" s 

€lENTİTY $ SVG.ColorProfile.attrib "" 

€lENTİTY $ SVG.Clip.attrib "" s 

€lENTİTY 55 SVG.Mask.attrib "" s 

€lENTİTY $ SVG.Filter.attrib "" s 

€lENTİTY 55 SVG.GraphicalEvents.attrib "" s 

€lENTİTY 55 SVG.Cursor.attrib "" s 

€lENTITY $ SVG.XLinkEmbed.attrib "" s 

€IENTİTY $ SVG.External.attrib "" s 

e1-- SVG.lmage.class .....................9ə......3....... 5 


€IENTİTY $ SVG.lmage.extra.class "" 5 
€VENTİTY 5. SVG.lmage.class 


"1 S5SVG.image .qname, 5“:5VG. Image .extra.class, " 
z 


c1-- image: Image Element .............................. --- 
€VENTİTY 55 SVG.image.extra.content "" s 
€IENTİTY $ SVG.image.element "INCLUDE" 5 


cl (55SVG.image element, 1 
€IENTİTY $ SVG.image.content 


"( S5SVG.Description.class, 1 S5:8VG.Animation.class, 
555VG.image.extra.content, )”" 
z 
€ ELEMENT 5:SVG. image .qname, 5S55VG. image. content, x 
c1-- end of SVG.image element --x115 


€lENTİTY $ SVG.image.attlist "INCLUDE" 5 
c185SVG.image.attlist,l 
€ 1ATTLIST S:SVG.image .qname , 
S58VG.Core.attrib, 
SSVG.Conditional.attrib, 
S5SVG.Style.attrib, 
S58VG.Presentation.attrib, 
S58VG.GraphicalEvents.attrib, 
Ss5SVG.XLinkEmbed.attrib, 
S5SVG.External.attrib, 
x sseCoordinate.datatype, £IMPLIED 
y sseCoordinate.datatype, £IMPLIED 
vidth "sLength.datatype, “£REQUTRED 
height s:Length.datatype, “£REQUTRED 
preserveAspectRatio 5:PreserveAspectRatioSpec.datatype, "xMidYMid meet" 
transform S:TransformList.datatype, £1MPLTED 
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z 
c1-- end of SVG.image.attlist --s115 





c1-- end of svg-image.mod --5 


A.3.21 Style Module 


The Style Module defines the Style.class element collection and the Style.attrib attribute collection. 


Collection name İ Elements in collection 


Style.class 


Collection name İ Attributes in collection 





sl zs sa DƏ omə m Do nəsnə Də pı usp --- 
eı-- SVG nüm Style Module -UU əə a maz a ala RƏR Ra ar RAR RLRR Ba RĞ AŞAR səyəlbs --5 
c1-- file: svg-style.mod 


This is SVG, a language for describing tvo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), ALL Rights Reserved. 
Revision: $1d: svg-style.mod,v 1.3 2011/07/08 03:18:59 cmccorma Exp $ 
This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//3C/ /ELEMENTS SVG 1.1 Style//EN" 
SYSTEM "http: / /vvv..V3.org/Graphics/SVG/1.1/DTD/svg-style.mod" 


OUR -- 
c1-- Style 
style 
This module declares markup to provide support for stylesheet. 
--- 
c1-- list of classes --s 


€IENTİTY $ ClassList.datatype "CDATA" x 


c1-- comma-separated list of media descriptors. --x 
€IENTİTY 55 MediaDesc.datatype "CDATA" x 


c1-- style sheet data --x 
€lENTİTY $ StyleSheet.datatype "CDATA" 5 


c1-- Qualified Names (Default) ......................... --- 
€lENTİTY 55 SVG.style.qname "style" s 


c1-- Attribute Collections (Default) ................... --- 
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€VENTİTY 55 SVG.Core.attrib "" s 
silz SV.Style: class, söşü əya DR ŞD a YURŞRa UŞŞŞ --- 
€lENTİTY 55 SVG.Style.extra.class "" s 
€ENTİTY 55 SVG.Style.class 
"1 S5SVG.style.qname, 5:5VG.Style.extra.class," 
z 
sl-- SVG.Style.atirib: süzəəünə spa Ra Da Yeşaya saq --5 
€IENTİTY $ SVG.Style.extra.attrib "" s 
€lENTİTY $ SVG.Style.attrib 
"style sStyleSheet.datatype, £1MPLIED 


class ssClassList.datatype, £TIMPLTED 
358VG.Style.extra.attrib," 





z 
c1-- style: Style Element .............................. --5 
€IENTİTY 55 SVG.style.extra.content "" s 


€1ENTİTY 55 SVG.style.element "INCLUDE" 5 
cl (55SVG.style.element, 1 
€lENTİTY 55 SVG.style.content 
"( SPCDATA SSVG.style.extra.content, )“" 
z 
ce ELEMENT 5:SVG. style. qname, S55VG.style.content, s 
c1-- end of SVG.style.element --x115 


€lENTİTY $ SVG.style.attlist "INCLUDE" 5 
cl İ8SVG.style.attlist,l 
€ ATTLIST 5:SVG. style .qname, 
xml:space ( preserve ) ZFIXED "preserve" 
S5SVG.id.attrib, 
S5SVG.base.attrib, 
S58VG.lang.attrib, 
S5SVG.Core.extra.attrib, 
type “sContentType .datatype, 2£5REQUTRED 
media s:MediaDesc.datatype, £1MPLIED 
title SText.datatype, £1MPLIED 
z 
c1-- end of SVG.style.attlist --s1l1- 


c1-- end of svg-style.mod --5 


A.3.22 Shape Module 


The Shape Module defines the Shape.class element collection. 


Elements in collection 


rect, circle, line, polyline, polygon, ellipse, path 





c1-- file: svg-shape.mod 


This is SVG, a language for describing tvo-dimensional graphics in XML. 


Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), ALL Rights Reserved. 
Revision: $1d: svg-shape.mod,v 1.4 2011/07/08 03:18:59 cmccorma Exp $ 


This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//3C/ /ELEMENTS SVG 1.1 Shape/ /EN" 
SYSTEM "http: / /uvv.vV3.org/Graphics/SVG/1.1/DTD/svg-shape.mod" 
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x1-- Shape 
path, rect, circle, line, ellipse, polyline, polygon 


This module declares markup to provide support for graphical shapes. 
--- 


c1-- a list of points --s 
€lENTİTY $ Points.datatype "CDATA" 5 


c1-- Qualified Names (Default) ......................... --- 


€İENTİTY 
€IENTİTY 


SVG.path.qname "path" x 
SVG. rect.qname "rect" x 





96 

96 
€IENTİTY $ SVG.circle.qname "circle" 5 
€IENTİTY $ SVG.line.qname "line" xs 
€lENTİTY 55 SVG.ellipse.qname "ellipse" 5 
€IENTİTY 55 SVG.polyline.qname "polyline" s 
€ ENTİTY 55 SVG.polygon.qname "polygon" 5 
c1-- Attribute Collections (Default) ................... --- 
€IENTİTY 55 SVG.Core.attrib "" s 
€IENTİTY $ SVG.Conditional.attrib "" s 
€lENTİTY $ SVG.Style.attrib "" s 
€lENTİTY $ SVG.Paint.attrib "" s 
€lENTİTY 55 SVG.Color.attrib "" s 
€IENTİTY $ SVG.Üpacity.attrib "" s 
€IENTİTY 55 SVG.Graphics.attrib "" 
€lENTİTY 55 SVG.Marker.attrib "" s 
€lENTİTY $ SVG.Clip.attrib "" s 
€lENTİTY 55 SVG.Mask.attrib "" s 
€lENTİTY $ SVG.Filter.attrib "" s 
€lENTİTY 55 SVG.GraphicalEvents.attrib "" s 
€lENTİTY 55 SVG.Cursor.attrib "" s 
€IENTİTY $ SVG.External.attrib "" 
x1-- SVG.Shape.class ................................... --- 


€ENTİTY 55 SVG.Shape.extra.class "" s 


€1ENTİTY 55 SVG.Shape. class 
"1 S5SVG.path.qname, 1 S5:SVG. rect.qname, 1 S5SVG.circle.qname, 
İ “5SVG.line .qname, 1 S5SVG.ellipse.qname, 1 S5SVG.polyline. qname, 
İ “5SVG.polygon.qname, 5S55VG.Shape.extra.class," 
z 


e€1-- path: Path Element .....................3.3.3..8884 --- 
€IENTİTY 55 SVG.path.extra. content "" s 


€IENTİTY 55 SVG.path.element "INCLUDE" x 
cl İ55SVG. path.element, 1 
€lENTİTY 55 SVG.path.content 
"( S5SVG.Description.class, 1 55:8VG.Animation.class, 
S5SVG.path.extra.content, )”" 
z 
€ ELEMENT 55:SVG. path.qname, 5:5VG.path.content, xs 
x1-- end of SVG.path.element --s11- 


€IENTİTY $ SVG.path.attlist "INCLUDE" x 

cl İ8SSVG.path.attlist,l 

€ 1ATTLIST S:SVG.path.qname, 
S58VG.Core.attrib, 
S5SVG.Conditional.attrib, 
S58VG.Style.attrib, 
S58VG.Presentation.attrib, 


S58VG.GraphicalEvents.attrib, 
S5SVG.External.attrib, 
d s:PathData .datatype, Z£REQUTRED 
pathLength s:Number .datatype, Z£TMPLTED 
transform S:TransformList.datatype, £1MPLTED 
- 
c1-- end of SVG.path.attlist ---11l- 
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e1-- rect: Rectangle Element ........................... 
€IENTİTY 55 SVG.rect.extra.content "" s 


€IENTİTY 55 SVG.rect.element "INCLUDE" x 
el İS5SVG. rect.element, 1 
€lENTİTY 55 SVG.rect.content 
"( S5SVG.Description.class, 1 5:8VG.Animation.class, 
S5S8VG. rect.extra.content, )”" 
z 
ELEMENT 5:SVG. rect..qname, S5SVG. rect.content, xs 
c1-- end of SVG.rect.element --x11- 


€IENTİTY $ SVG.rect.attlist "INCLUDE" x 

cl İSSVG.rect.attlist,l 

€ ATTLIST S5SVG. rect .qname , 
S5SVG.Core.attrib, 
S5VG.Conditional.attrib, 
S58VG.Style.attrib, 
S58VG.Presentation.attrib, 
S58VG.GraphicalEvents.attrib, 
S5SVG.External.attrib, 
x 55Coordinate.datatype, £IMPLTED 
y s:Coordinate.datatype, £TIMPLTED 
vidth "sLength.datatype, “£REQUTRED 
height s:Length.datatype, £REQUTRED 
rx "sLength.datatype, ““TMPLIED 
ry "sLength.datatype, ““TMPLIED 
transform S:TransformList.datatype, £1MPLTED 





- 
c1-- end of SVG.rect.attlist --s11- 


e1-- circle: Circle Element ............................ 
€lENTİTY $ SVG.circle.extra. content "" s 


€lENTİTY $ SVG.circle.element "INCLUDE" x 
cl İ8SVG.circle element, 1 
€lENTİTY $ SVG.circle.content 
"( S5SVG.Description.class, 1 5S5:8VG.Animation.class, 
S58VG.circle.extra.content, )”" 


z 
€ ELEMENT 5:SVG.circle.qname, 5:SVG.circle. content, 5 
c1-- end of SVG.circle.element --s115 


€IENTİTY $ SVG.circle.attlist "INCLUDE" x 
e1İ8SVG.circle.attlist,1 
€ IATTLIST S:SVG.circle.qname, 
S58VG.Core.attrib, 
SSVG.Conditional.attrib, 
S5SVG.Style.attrib, 
S58VG.Presentation.attrib, 
S58VG.GraphicalEvents.attrib, 
S5SVG.External.attrib, 
cx $5Coordinate.datatype, £1MPLTED 
cy s5Coordinate.datatype, £1MPLTED 
r ssLength.datatype, Z£REQUTRED 
transform S:TransformList.datatype, £T1MPLTED 
z 
c1-- end of SVG.circle.attlist --s11- 


e1-- 1ine: Line Element ................................ 
€IENTİTY $ SVG.line.extra. content "" s 

€IENTİTY $ SVG.line.element "INCLUDE" x 

el İ85SVG.line.element, 1 


€lENTİTY $ SVG.line.content 
"( S5SVG.Description.class, 1 55:8VG.Animation.class, 
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555VG.line.extra.content, )”" 


z 
€ ELEMENT 5:SVG.line.qname, 5S:5VG.line.content, x 
c1-- end of SVG.line.element --s115 


€IENTİTY $ SVG.line.attlist "INCLUDE" x 

e1İ8SVG.line.attlist,1 

€ ATTLIST S5SVG.line .qname , 
S5SVG.Core.attrib, 
SVG.Conditional.attrib, 
S58VG.Style.attrib, 
S658VG.Presentation.attrib, 
S58VG.GraphicalEvents.attrib, 
S5SVG.External.attrib, 
x1 "sCoordinate.datatype, “TMPLIED 
y1 "sCoordinate.datatype, “TMPLIED 
x2 ssCoordinate.datatype, “TMPLIED 
y2 "sCoordinate.datatype, “TMPLIED 
transform 5:TransformList.datatype, £1MPLTED 

z 

c1-- end of SVG.line.attlist ---11l- 


c1-- ellipse: Ellipse Element .......................... --5 
€1ENTİTY 55 SVG.ellipse.extra. content "" s 


€ENTİTY 55 SVG.ellipse.element "INCLUDE" 5 
cl 8SVG.ellipse.element, 1 
€lENTİTY 55 SVG.ellipse.content 
"( S5SVG.Description.class, 1 55:8VG.Animation.class, 
358VG.ellipse.extra.content, )”" 
z 
€ ELEMENT 5:SVG.ellipse.qname, 555VG.ellipse.content, xs 
c1-- end of SVG.ellipse.element --x11- 


€lENTİTY $ SVG.ellipse.attlist "INCLUDE" 5 
el İ8SVG.ellipse.attlist,1 
€ ATTLIST S:SVG.ellipse . qname, 
S5SVG.Core.attrib, 
S5SVG.Conditional.attrib, 
S5SVG.Style.attrib, 
S58VG.Presentation.attrib, 
S58VG.GraphicalEvents.attrib, 
S5SVG.External.attrib, 
cx $sCoordinate.datatype, £1MPLTED 
cy s5Coordinate.datatype, £1MPLTED 
rx SsLength.datatype, “2REQUTRED 
ry "sLength.datatype, 2£REQUTRED 
transform $:TransformList.datatype, £T1MPLTED 
z 
c1-- end of SVG.ellipse.attlist --c11- 


c€1-- polyline: Polyline Element ........................ --5 
€IENTİTY 55 SVG.polyline.extra. content "" s 


€lENTİTY 55 SVG.polyline.element "İNCLUDE" 5 
cl (555VG. polyline .element, 1 
€lENTİTY $ SVG.polyline.content 
"( S5SVG.Description.class, 1 5S:8VG.Animation.class, 
958VG.polyline.extra.content, )”" 
- 
€ ELEMENT 5:SVG.polyline.qname, 5:5VG.polyline. content, xs 
c1-- end of SVG.polyline.element --s11- 


€lENTİTY $ SVG.polyline.attlist "INCLUDE" 5 

cl 8SVG.polyline.attlist,1 

€ ATTLIST S:SVG.polyline.qname, 
S5SVG.Core.attrib, 
S5SVG.Conditional.attrib, 
S58VG.Style.attrib, 
S58VG.Presentation.attrib, 
S58VG.GraphicalEvents.attrib, 
S5SVG.External.attrib, 
points 5:Points.datatype, “£REQUTRED 
transform $:TransformList.datatype, £1MPLTED 


c1-- end of SVG.polyline.attlist --slls 
c1-- polygon: Polygon Element .......................... --- 
€1ENTİTY 55 SVG.polygon.extra. content "" s 


€VENTİTY 55 SVG.polygon. element "INCLUDE" 5 
cl İ55SVG. polygon. element, 1 
€VENTİTY 55 SVG.polygon. content 
"( S5SVG.Description.class, 1 55:8VG.Animation.class, 
35SVG.polygon.extra.content, )”" 
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z 
€ ELEMENT S“SVG. polygon .qname , S:SVG. polygon. content, 5 
c1-- end of SVG.polygon.element --x115 


€1ENTITY $ SVG.polygon.attlist "INCLUDE" 5 

cl 1555VG.polygon.attlist,l 

€ ATTLIST 5S:SVG. polygon.. qname , 
S5SVG.Core.attrib, 
S5V6G.Conditional.attrib, 
S5SVG.Style.attrib, 
s5SVG.Presentation.attrib, 
S5SVG.GraphicalEvents.attrib, 
Ss5SVG.External.attrib, 
points S5Points.datatype, “2/REQUTIRED 
transform SseTransformList.datatype, £IMPLIED 





z 
c€1-- end of SVG.polygon.attlist --s11- 


xc1-- end of svg-shape.mod --x” 


A.3.23 Text Module 


The Text Module defines the Text.class and TextContent.class element collections and the Text.attrib, TextCon- 
tent.attrib and Font.attrib attribute sefs. 


Collection name Elements in collection 
TextContent.class İtspan, tref, textPath, altGiyph 


Collection name Attributes in collection 


TextContent.attrib İ alignment-baseline, baseline-shift, direction, dominant-baseline, glyph-orientation-horizontal, 


glyph-orientation-vertical, kerning, letter-spacing, text-anchor, text-decoration, unicode-bidi, 
vvord-spacing 





Font.attrib font-family, font-size, font-size-adiust, font-stretch, font-siyle, font-variant, font-vveight 
2.” ”””””””””””””” ””” --5 
el SV6 1-1 Text: Müdule: Ucu əəə A R al RA aa A Ba a eu ə sız --5 
c1-- file: svg-text.mod 


This is SVG, a language for describing tuo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), All Rights Reserved. 
Revision: $I1d: svg-text.mod,v 1.3 2011/07/08 03:18:59 cmccorma Exp $ 
This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//3C//ELEMENTS SVG 1.1 Text//EN" 
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SYSTEM "http: / /vvv/..v3.org/Graphics/SVG/1.1/DTD/svg-text.mod" 


.aaaassssa sss sa asıssasasasssassssausasısısansıssssusısınınıasnıasııaıaım -—— 

c1-- Text 
text, tspan, tref, textPath, altGlyph, altGlyphDef, altGlyphItem, 
glyphRefT 

This module declares markup to provide support for alternate glyph. 
--- 
c1-- "baseline-shift" property/attribute value (e.g., "baseline", "sub", etc.) --s 
€IENTİTY $ BaselineShiftValue.datatype "CDATA" 5 
€1-- "font-family" property/attribute value (i.e., list of fonts) --s 
€ENTİTY 55 FontFamilyValue.datatype "CDATA" 5 
c1-- "font-size" property/attribute value --x 
€lENTİTY 55 FontSizeValue.datatype "CDATA" 5 
c1-- "font-size-adiust" property/attribute value --s 
€lENTİTY 55 FontSizeAdfiustValue.datatype "CDATA" x 
c1-- "glyph-orientation-horizontal" property/attribute value (e.g., cangles) --s 
€IENTİTY $ GlyphOrientationHorizontalValue.datatype "CDATA" 5 
c1-- "glyph-orientation-vertical" property/attribute value (e.g., "auto", cangles) --s 
€lENTİTY $ GlyphOrientationVerticalValue.datatype "CDATA" 5 
c1-- "kerning" property/attribute value (e.g., "auto", clengths) --s 
€lENTİTY 55 KerningValue.datatype "CDATA" 5 
c1-- "letter-spacing" or "vord-spacing" property/attribute value (e.g., "normal", -clengthx) 
€lENTİTY 55 SpacingValue.datatype "CDATA" 5 
c1-- "text-decoration" property/attribute value (e.g., "none", "underline") --z 


€IENTİTY 55 TextDecorationValue.datatype "CDATA" x 


c1-- Qualified Names (Default) ......................... --- 
€IENTİTY 5 SVG.text.qname "text" xs 

€VENTİTY 55 SVG.tspan.qname "tspan" 5 

€ENTİTY 55 SVG.trefT.qname "tref" s 

€lENTİTY 55 SVG.textPath.qname "textPath" x 

€ENTİTY 55 SVG.altGlyph.qname "altölyph" s 

€1ENTİTY 55 SVG.altGlyphDef .qname "altGlyphDef" s 

€IENTİTY 55 SVG.altGlyphItem.qname "altGlyphitem" xs 

€ENTİTY 55 SVG.glyphRef .qname "glyphRef" s 

c1-- Attribute Collections (Default) ................... --- 
€lENTİTY $ SVG.Core.attrib "" s 

€IENTİTY $ SVG.Conditional.attrib "" s 

€lENTİTY $ SVG.Style.attrib "" s 

€lENTİTY $ SVG.Paint.attrib "" s 

€IENTİTY 55 SVG.Color.attrib "" s 

€IENTİTY $ SVG.Üpacity.attrib "" s 

€IENTİTY 5 SVG.Graphics.attrib "" s 

€IENTİTY $ SVG.Clip.attrib "" s 

€IENTİTY 55 SVG.Mask.attrib "" s 

€lENTİTY $ SVG.Filter.attrib "" s 

€IENTİTY 55 SVG.GraphicalEvents.attrib "" s 

€lENTİTY 55 SVG.Cursor.attrib "" s 

€lENTİTY $ SVG.XLink.attrib "" s 

€1ENTİTY $ SVG.XLinkRequired.attrib "" 5 

€IENTİTY 5 SVG.External.attrib "" 

sil SVGTeXxin.cilasSı sı yd bz SAĞRUR Aaa RAR iba subasabdadb --- 


€IENTİTY 55 SVG.Text.extra. class "" s 
€IENTİTY 55 SVG.Text.class 


"1 S5SVG.text.qname, 1 S55VG.altGlyphDef .qname, “:SVG.Text.extra.class," 
z 


c1-- SVG.TextContent.class ............................. -- 
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€lENTİTY 55 SVG.TextContent .extra.class "" s 
€lENTİTY 55 SVG.TextContent.class 
"1 S5SVG.tspan.qname, 1 S:SVG.tref.qname, 1 S5SVG.textPath.qname, 


İ “5SVG.altGlyph .qname, 5“:5VG.TextContent .extra.class," 
z 


xil oSVG-Textuatltrib: “uyu ba ua saad baıdod a bodun a Ras dubadb --- 


€IENTİTY $ SVG.Text.extra.attrib "" s 





€IENTİTY $ SVG.Text.attrib 
"vriting-mode ( lr-tb 1 rl-tb / tb-rl 1 lr 1 rl 1 tb 1 inherit ) £FIMPLIED 
358VG.Text.extra.attrib," 

z 


c1-- SVG.TextContent.attrib ............................ --5 
€IENTİTY 55 SVG.TextContent.extra.attrib "" s 


€lENTİTY $ SVG.TextContent.attrib 
"alignment-baseline ( auto Il baseline 1 before-edge / text-before-edge 1 
middle / central / after-edge / text-after-edge 1 
ideographic /I alphabetic Il hanging 1 mathematical 1 
inherit ) £IMPLIED 
baseline-shift sBaselineShiftValue.datatype, ““IMPLIED 
direction ( ltr I rtl /I inherit ) £IMPLIED 
dominant-baseline ( auto İl use-script l no-change l reset-size 1 
ideographic Il alphabetic Il hanging 1 mathematical 1 
central 1 middle 1 text-after-edge 1I text-before-edge 1 
inherit ) £IMPLIED 
glyph-orientation-horizontal ss61yphOrientationHorizontalValue.datatype, 
YTMPLIED 
glyph-orientation-vertical Ss6lyphOrientationVerticalValue.datatype, 
STMPLIED 
kerning 5:KerningValue .datatype, £T1MPLTED 
letter-spacing 5:SpacingValue.datatype, 2TMPLIED 
text-anchor ( start 1 middle Il end 1 inherit ) FIMPLIED 
text-decoration "sTextDecorationValue.datatype, “"IMPLIED 
unicode-bidi ( normal 1 embed 1 bidi-override 1 inherit ) FIMPLIED 
vord-spacing 5:SpacingValue.datatype, “IMPLIED 
358VG.TextContent.extra.attrib," 





z 
e1-- SVG.Font.attrib .....cuu üə ua şeyə a Ba BəPusdsRs --- 
€IENTİTY $ SVG.Font.extra.attrib "" 


€IENTİTY $ SVG.Font.attrib 
"font-family S5FontFamilyValue.datatype, FIMPLIED 
font-size S5FontSizeValue.datatype, £TMPLIED 
font-size-adiust Ss5FontSizeAdiTustValue.datatype, £TIMPLTED 
Tfont-stretch ( normal l vider 1 narrover 1 ultra-condensed 1 
extra-condensed 1 condensed 1 semi-condensed 1 
semi-expanded 1 expanded 1 extra-expanded 1 
ultra-expanded 1 inherit ) £IMPLIED 
font-style ( normal 1 italic 1 oblique 1 inherit ) FIMPLIED 
font-variant ( normal 1 small-caps 1 inherit ) FIMPLIED 
font-veight ( normal 1 bold 1 bolder 1 lighter / 100 / 200 1 300 1 400 1 
500 1 600 1 700 1 800 1 900 I inherit ) £IMPLIED 
358VG.Font.extra.attrib," 
z 


c€1-- text: Text Element ................................ --5 
€IENTİTY $ SVG.text.extra. content "" s 


€IENTİTY $ SVG.text.element "INCLUDE" x 

cl (S5SVG. text .element, 1 

€lENTİTY $ SVG.text.content 

"( £PCDATA 1 S5SVG.Description.class, 1 5$5SVG.Animation.class, 

555VG.TextContent. class, S:SVG.Hyperlink.class, 
555VG.text.extra.content, )“" 

z 

€ ELEMENT 5:SVG. text ..qname, 5S:5VG.text.content, x 

c1-- end of SVG.text.element --s11- 


€IENTİTY $ SVG.text.attlist "INCLUDE" x 
e1İ8SVG.text.attlist,1 
€ ATTLIST S5SVG. text .qname 
S58VG.Core.attrib, 
S5SVG.Conditional.attrib, 
S5SVG.Style.attrib, 
958VG.Presentation.attrib, 
S5SVG.GraphicalEvents.attrib, 
S5SVG.External.attrib, 
x 55Coordinates.datatype, “TMPLIED 
y s5Coordinates.datatype, “TMPLIED 
dx SsLengths .datatype, “£TMPLTED 
dy “sLengths .datatype, £TMPLTED 
rotate ssNumbers.datatype, £TIMPLTED 
textLength "sLength.datatype, £1MPLIED 
lengthAdiust ( spacing İl spacingAndGölyphs ) £1MPLTED 
transform 5:TransformList.datatype, £1MPLTED 
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z 
c1-- end of SVG.text.attlist --s115 


€1-- tspan: Text Span Element .......................... --- 


€IENTİTY 55 SVG.tspan.extra.content "" s 





€ENTİTY 55 SVG.tspan.element "INCLUDE" 5 
cl İ55SVG. tspan.element, 1 
€lENTİTY 55 SVG.tspan.content 
"( 2£PCDATA 1 S5SVG.tspan.qname, 1 S:SVG.trefT.qname, 1 S5SVG.altGlyph.qname, 
İ “5SVG.animate .qname, 1 S5SVG.set.qname, 1 S5SVG.animateColor .qname, 
İ “SVG.Description.class, S5SVG.Hyperlink.class, 
35SVG.tspan.extra.content, )”" 

- 
ce ELEMENT 5:SVG. tspan.qname, 5S:5VG.tspan.content, xs 
c1-- end of SVG.tspan.element --x11- 


€lENTİTY $ SVG.tspan.attlist "INCLUDE" 5 
cl 5SVG.tspan.attlist,l 
€ ATTLIST 55SVG. span. qname, 
S5SVG.Core.attrib, 
S5SVG.Conditional.attrib, 
S5SVG.Style.attrib, 
S58VG.Presentation.attrib, 
S58VG.GraphicalEvents.attrib, 
S5SVG.External.attrib, 
x 55Coordinates.datatype, “TMPLIED 
y s5Coordinates.datatype, “TMPLIED 
dx SsLengths .datatype, “£TMPLTED 
dy “sLengths .datatype, £TMPLTED 
rotate ss:Numbers.datatype, £TIMPLTED 
textLength "sLength.datatype, £1MPLIED 
lengthAdiust ( spacing İl spacingAndGlyphs ) £1MPLTED 





z 
c1-- end of SVG.tspan.attlist --s115 


c1-- tref: Text Reference Element ...................... -- 
€IENTİTY 55 SVG.tref.extra.content "" s 


€IENTİTY 55 SVG.trefT.element "INCLUDE" x 
cl İ5SVG.treT.element, 1 
€lENTİTY 55 SVG.trefT.content 

"( S5SVG.animate .qname, 1 5S5SVG.set.qname, 1 S5SVG.animateColor .qname, 

İ “SVG.Description.class, S5SVG.treT.extra.content, )”" 

z 
€ ELEMENT S:SVG. tref .qname , S:SVG. tref .content, x 
c1-- end of SVG.trefT.element --x11- 


€IENTİTY $ SVG.tref.attlist "INCLUDE" x 

el İ8SVG.tref.attlist,l 

€ ATTLIST S5SVG. tref .qname 
S58VG.Core.attrib, 
S5SVG.Conditional.attrib, 
S5SVG.Style.attrib, 
S58VG.Presentation.attrib, 
S58VG.GraphicalEvents.attrib, 
S5SV6.XLinkRequired.attrib, 








S5SVG.External.attrib, 

x 55Coordinates.datatype, ““TMPLIED 

y s5Coordinates.datatype, “TMPLIED 

dx SsLengths .datatype, “£TMPLTED 

dy “sLengths .datatype, “£TMPLTED 

rotate ss:Numbers.datatype, £TIMPLTED 

textLength "sLength.datatype, £1MPLIED 

lengthAdiust ( spacing İl spacingAndGlyphs ) £1MPLTED 
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z 
c1-- end of SVG.tref.attlist --s11- 


e1-- textPath: Text Path Element ....................... --- 
€IENTİTY 5 SVG.textPath.extra.content "" s 


€lENTİTY $ SVG.textPath.element "INCLUDE" 5 
cl (55SVG. textPath .element, 1 
€lENTİTY $ SVG.textPath.content 
"( £PCDATA 1 S5SVG.tspan.qname, 1 S:SVG.trefT.qname, 1 S:SVG.altGlyph.qname, 
İ “5SVG.animate .qname, 1 S5:SVG.set.qname, 1 S55VG.animateColor .qname, 
İ “SVG.Description.class, S5SVG.Hyperlink.class, 
358VG.textPath.extra.content, )”" 

z 
€ ELEMENT S:SVG. textPath.qname, 9:5VG.textPath.content, x 
c1-- end of SVG.textPath.element --s115 





€lENTİTY $ SVG.textPath.attlist "INCLUDE" 5 

cl 5SVG.textPath.attlist,1 

€ 1ATTLIST S5SVG.textPath .qname, 
S58VG.Core.attrib, 
S5VG.Conditional.attrib, 
S5SVG.Style.attrib, 
S58VG.Presentation.attrib, 
S58VG.GraphicalEvents.attrib, 
S5SV6.XLinkRequired.attrib, 
S5SVG.External.attrib, 
startOffset "sLength.datatype, £1MPLIED 
textLength "sLength.datatype, £1MPLIED 
lengthAdiust ( spacing İl spacingAndGlyphs ) £1MPLTED 
method ( align 1 stretch ) FIMPLIED 
spacing ( auto İl exact ) £IMPLIED 





- 
c1-- end of SVG.textPath.attlist --s11- 


c1-- altGlyph: Alternate Glyph Element ................. --- 
€IENTİTY 55 SVG.altGlyph.extra. content "" s 


€lENTİTY 55 SVG.altGlyph.element "INCLUDE" 5 
cl fS5SVG.altGlyph.element, 1 
€lENTİTY 55 SVG.altGlyph.content 
"( 35PCDATA S5SVG.altGlyph.extra.content, )“" 
z 
e ELEMENT 5:SVG..altGlyph..qname, S:SVG.altGlyph. content, xs 
c1-- end of SVG.alt6Glyph.element --s115 


€lENTİTY $ SVG.altGlyph.attlist "INCLUDE" 5 
cl İS5SVG.altGlyph.attlist,1 
€ ATTLIST S:SVG.altGlyph..qname, 
S5SVG.Core.attrib, 
S5SVG.Conditional.attrib, 
S58VG.Style.attrib, 
S58VG.Presentation.attrib, 
S58VG.GraphicalEvents.attrib, 
SsSV6.XLink.attrib, 
S5SVG.External.attrib, 
x 55Coordinates.datatype, “TMPLIED 
y s5:Coordinates.datatype, “5TMPLIED 
dx SsLengths .datatype, “£TMPLTED 
dy “sLengths .datatype, £T1MPLTED 
glyphRef CDATA £1MPLIED 
Tormat CDATA £IMPLIED 
rotate ssNumbers.datatype, £TIMPLTED 
z 
c1-- end of SVG.altölyph.attlist --slls 


c1-- altGlyphDef: Alternate Glyph Definition Element ... --x 


€ENTİTY 55 SVG.altGlyphDef .extra.content "" s 


€ENTİTY 55 SVG.altGlyphDef .element "INCLUDE" x 
cl fS5SVG .altGlyphDef .element, 1 
€1ENTİTY 55 SVG.altGlyphDef .content 
"(( “5SVG.glyphRef .qname”- 1 S55VG.altGlyphT1tem.qnane  “ ) 
35SVG .altGlyphDef .extra.content, )" 
z 
€ ELEMENT 5:SVG ..altGlyphDef .qname, 5:5SVG.altGlyphDef .content, 5 
c1-- end of SVG.alt6GlyphDef .element --s115 
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€IENTİTY $ SVG.altGlyphDef.attlist "INCLUDE" 5 

el İS5SVG .altGlyphDef .attlist,1 

€ ATTLIST S:SVG.altGlyphDef .qname 
S5SVG.Core.attrib, 

z 

c1-- end of SVG.altGlyphDef.attlist --s115 


c1-- altGlyphltem: Alternate Glyph Item Element ........ --- 
€IENTİTY 55 SVG.altGlyphTItem.extra. content "" s 

€lENTİTY $ SVG.altGlyphItem.element "INCLUDE" x 

cl İS5SVG.altGlyphItem.element, 1 


€IENTİTY $ SVG.altGlyphTItem.content 
"( S5SVG.glyphRef .qname”, c 555VG.altGlyphTtem.extra.content, )" 





z 
€ ELEMENT 5“:SVG..altGlyphTtem.qname, “:SVG.altGlyphTtem.content, 5 
x1-- end of SVG.altGlyphitem.element --s115 


€lENTİTY $ SVG.altGlyphItem.attlist "INCLUDE" x 

cl İ8SVG.altGlyphitem.attlist,1 

€ 1ATTLIST S:SVG.altGlyphTItem.qname, 
S58VG.Core.attrib, 

z 

c1-- end of SVG.altGlyphitem.attlist --s115 


c1-- glyphRef: Glyph Reference Element ................. --- 


€ENTİTY 55 SVG.glyphRef..element "İNCLUDE" 5 

cl (S58VG.glyphRef .element” 1 

€ENTİTY 55 SVG.glyphRef .content "EMPTY" x 

ce ELEMENT 5:SVG.glyphRef .qname, 5:5VG.glyphRef .content, xs 
c1-- end of SVG.glyphRef .element --s11- 


€lENTİTY $ SVG.glyphRef.attlist "INCLUDE" 5 
cl (958VG.glyphRef.attlist,l 
€ ATTLIST 5:SVG.glyphRef .qname, 
S5SVG.Core.attrib, 
S58VG.Style.attrib, 
S58VG.Presentation.attrib, 
S5SV6.XLink.attrib, 
x s5Number .datatype, £1MPLTED 
y “5Number .datatype, £1MPLTED 
dx ssNumber..datatype, ““TMPLIED 
dy ssNumber.datatype, “”TMPLİIED 
glyphRef CDATA £TMPLTIED 
Tormat CDATA £IMPLTED 
z 
c1-- end of SVG.glyphRef.attlist --s11- 


c1-- end of svg-text.mod --x 


A.3.24 Basic Text Module 


The Basic Text Module defines the Text.class and TextContent.class element collections and the TextContent.attrib 
and Font.attrib attribute sets. 
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Attributes in collection 


font-family, font-size, font-style, font-vveight 





c1-- file: svg-basic-text.mod 


This is SVG, a language for describing tuo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), ALL Rights Reserved. 
Revision: $I1d: svg-basic-text.mod,v 1.3 2011/07/08 03:18:58 cmccorma Exp $ 





This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//M3C//ELEMENTS SVG 1.1 Basic Text//EN" 
SYSTEM "http: / /uvv.vV3.org/Graphics/SVG/1.1/DTD/svg-basic-text.mod" 


c1-- Basic Tex 
text 


This module declares markup to provide support for text. 
--- 


c1-- "font-family" property/attribute value (i.e., list of fonts) --s 
€1ENTIİTY $ FontFamilyValue.datatype "CDATA" x 


c1-- "font-size" property/attribute value --x 
€lENTİTY $ FontSizeValue.datatype "CDATA" x 





c1-- Qualified Names (Default) ......................... --5 


€IENTİTY 55 SVG.text.qname "text" s 


c1-- Attribute Collections (Default) ................... 5 
€IENTİTY 5 SVG.Core.attrib "" s 

€lENTİTY $ SVG.Conditional.attrib "" s 
€lENTİTY $ SVG.Style.attrib "" s 

€lENTİTY $ SVG.Paint.attrib "" s 

€lENTİTY 55 SVG.Color.attrib "" s 

€IENTİTY $ SVG.Üpacity.attrib "" s 
€IENTİTY 5 SVG.Graphics.attrib "" 
€IENTİTY $ SVG.Clip.attrib "" s 

€IENTİTY 55 SVG.Mask.attrib "" s 

€lENTİTY $ SVG.Filter.attrib "" s 

€lENTİTY 55 SVG.GraphicalEvents.attrib "" s 
€lENTİTY 55 SVG.Cursor.attrib "" s 

€IENTİTY 5 SVG.External.attrib "" 


sizə “SVG. Textocilas5” su x ox sal AAA AR alə szbalsəyd əs 5 
€lENTİTY 55 SVG.Text.extra. class "" s 
€IENTİTY 55 SVG.Text.class 

"1 S5SVG.text.qname, S:SVG.Text.extra.class," 


z 


e€1-- SVG.TextContent.attrib ............................ --- 





€lENTİTY 55 SVG.TextContent.extra.attrib "" s 


€lENTİTY $ SVG.TextContent.attrib 
"text-anchor ( start l middle /I end / inherit ) £FIMPLIED 
958VG.TextContent.extra.attrib," 

z 


silə “SVG:FOnNtəattrib: ünün ə lə subıkalə aşya ns alə şmalsəy ış --- 
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€IENTİTY $ SVG.Font.extra.attrib "" s 


€IENTİTY $ SVG.Font.attrib 
"font-family S5FontFamilyValue.datatype, FIMPLIED 
font-size S5FontSizeValue.datatype, ZSTMPLIED 
font-style ( normal 1 italic 1 oblique 1 inherit ) FIMPLIED 
font-veight ( normal 1 bold 1 bolder 1 lighter / 100 1 200 1 300 1 400 1 
500 1 600 1 700 1 800 1 900 /I inherit ) £IMPLIED 
358VG.Font.extra.attrib," 
z 


e€1-- text: Text Element ................................ -- 
€IENTİTY $ SVG.text.extra.content "" s 


€IENTİTY $ SVG.text.element "INCLUDE" x 
cl İ5SVG.text.element, 1 
€lENTİTY $ SVG.text.content 
"( 2PCDATA 1 S5SVG.Description.class, 1 S58VG.Animation.class, 
555VG.Hyperlink.class, 5S5:SVG.text.extra.content, )”" 





z 
€ ELEMENT 5:SVG. text ..qname, 5S:5VG.text.content, xs 
c1-- end of SVG.text.element --x11- 


€IENTİTY $ SVG.text.attlist "INCLUDE" x 

clİ8SVG.text.attlist,1 

€ IATTLIST 5S:SVG.text.qname, 
S5SVG.Core.attrib, 
S5SVG.Conditional.attrib, 
S5SVG.Style.attrib, 
S58VG.Presentation.attrib, 
S58VG.GraphicalEvents.attrib, 
S5SVG.External.attrib, 
x 55Coordinates.datatype, “TMPLIED 
y s:Coordinates.datatype, “TMPLIED 
rotate ssNumbers.datatype, £TIMPLTED 
transform 5:TransformList.datatype, £T1MPLTED 





z 
c1-- end of SVG.text.attlist --s11- 


c1-- end of svg-basic-text.mod --5 


A.3.25 Marker Module 


The Marker Module defines the Marker.class element collection and the Marker.attrib attribute set. 


Collection name İ Elements in collection 


Collection name Attributes in collection 
Marker.attrib marker-start, marker-mid, marker-end 





S SƏ ə ə ə UD OL SXL U0İ 2-5 
sil--o5V6:1-4 Marker: Mödute: sənə RET Rə AR BR daun? kesaydmussb 85 
c1-- file: svg-marker.mod 


This is SVG, a language for describing tvo-dimensional graphics in XML. 
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Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), ALL Rights Reserved. 
Revision: $1d: svg-marker.mod,v 1.3 2011/07/08 03:18:59 cmccorma Exp $ 


This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//3C/ /ELEMENTS SVG 1.1 Marker//EN" 
SYSTEM "http: / /vvv/.v3.org/Graphics/SVG/1.1/DTD/svg-marker.mod" 


c1-- Marker 
marker 


This module declares markup to provide support for marker. 
--- 


c1-- "marker" property/attribute value (e.g., "none", curis) --s 
€ENTİTY 55 MarkerValue.datatype "CDATA" x 


c1-- Qualified Names (Default) ......................... -- 


€ VENTİTY 5. SVG.marker ..qname "marker" 5 


c1-- Attribute Collections (Default) ................... --- 
€IENTİTY 55 SVG.Core.attrib "" s 
€lENTİTY $ SVG.Container.attrib "" s 
€lENTİTY $ SVG.Style.attrib "" s 
€IENTİTY $ SVG.Vievport.attrib "" 
€IENTİTY $ SVG.Text.attrib "" s 
€IENTİTY $ SVG.TextContent.attrib "" s 
€IENTİTY $ SVG.Font.attrib "" s 
€IENTİTY $ SVG.Paint.attrib "" s 
€lENTİTY 55 SVG.Color.attrib "" s 
€IENTİTY $ SVG.Üpacity.attrib "" s 
€IENTİTY $ SVG.Graphics.attrib "" 
€lENTİTY $ SVG.ColorProfile.attrib "" s 
€IENTİTY $ SVG.Gradient.attrib "" 
€lENTİTY $ SVG.Clip.attrib "" s 
€IENTİTY $ SVG.Mask.attrib "" s 
€lENTİTY $ SVG.Filter.attrib "" s 
€IENTİTY $ SVG.FilterColor.attrib "" s 
€lENTİTY 55 SVG.Cursor.attrib "" s 
€IENTİTY $ SVG.External.attrib "" 
el-- SVG.Marker:-classi ii usulu saa yaaa y sala salma --- 


€IENTİTY 55 SVG.Marker..extra. class "" s 


€ VENTİTY 5. SVG.Marker.class 
"1 “SVG.marker .qname, 5S:SVG.Marker.extra.class," 
z 


eV-- SVG.Marker.attrib vo süuu əəə daaa aa yaaa svadba --- 
€IENTİTY $ SVG.Marker.extra.attrib "" s 


€lENTİTY $ SVG.Marker.attrib 
"marker-start ssMarkerValue .datatype, £1MPLTED 
marker-mid ssMarkerValue.datatype, “2”TMPLIED 
marker-end ssMarkerValue.datatype, 2”TMPLIED 
558VG.Marker.extra.attrib," 

- 


e€1-- SVG.Presentation.attrib ........................... -- 
€lENTİTY $ SVG.Presentation.extra.attrib "" s 


€lENTİTY $ SVG.Presentation.attrib 

"SSVG.Container.attrib, 
358VG.Vieuvport.attrib, 
555VG.Text.attrib, 
558VG.TextContent.attrib, 
958VG.Font.attrib, 
358VG.Paint.attrib, 
558VG.Color.attrib, 


555VG.Opacity.attrib, 

358VG.Graphics.attrib, 

558VG.Marker.attrib, 
358VG.ColorProfile.attrib, 
358VG.Gradient.attrib, 

358VG.Clip.attrib, 

558VG.Mask.attrib, 

S58V6G.Filter.attrib, 
358V6.FilterColor.attrib, 
358VG.Cursor.attrib, 

T1ood-color SsSVGColor..datatype, £T1MPLIED 
T1ood-opacity 5$s0pacityValue.datatype, £1MPLTED 
lighting-color S5SVGColor.datatype, £TMPLTED 
358VG.Presentation.extra.attrib," 
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z 
e1-- marker: Marker Element ............................ --- 
€ENTİTY 55 SVG.marker.extra. content "" s 


€ENTİTY 55 SVG.marker..element "INCLUDE" x 

el İ55SVG marker element, 

€ENTİTY 55 SVG.marker. content 

"( S5SVG.Description.class, 358VG.Animation.class, S:SVG.Structure.class, 

555VG.Conditional.class, S:SVG.Tmage. class, 55SVG.Style.class, 
35SVG ..Shape.. class, S5SVG. Text.class, S5SVG.Marker.class, 
55SVG.ColorProfile. class, S5:SVG.Gradient.class, 5$5SVG.Pattern.class, 
358VG.Clip.class, 3:8VG.Mask.class, 3558VG.Filter.class, S:SVG.Cursor.class, 
555VG.Hyperlink.class, 5S:SVG.Viev.class, S58VG.Secript.class, 
555VG.Font.class, $55VG.Extensibility.class, S:SVG.marker.extra.content, )”" 








z 
ce ELEMENT 55SVG marker .qname, “5:SVG.marker..content, 5 
c1-- end of SVG.marker .element --x115 


€lENTİTY $ SVG.marker.attlist "INCLUDE" x 
cl İS5SVG.marker.attlist,1 
€ ATTLIST S:SVG..marker .qname, 
S5SVG.Core.attrib, 
S5SVG.Style.attrib, 
S58VG.Presentation.attrib, 
S5SVG.External.attrib, 
refX ssCoordinate.datatype, £1MPLIED 
refY ssCoordinate.datatype, £1MPLIED 
markerUnits ( strokellidth Il userSpaceOnUse ) £TMPLTIED 
markeriidth SsLength.datatype, “£IMPLIED 
markerHeight SsLength.datatype, £IMPLIED 
orient CDATA £IMPLIED 
vievBox SsVievBoxSpec.datatype, “£1MPLIED 
preserveAspectRatio 5:PreserveAspectRatioSpec.datatype, "xMidYMid meet" 
z 
c1-- end of SVG.marker.attlist --s11- 


c1-- end of svg-marker.mod --5 


A.3.26 Color Profile Module 


The Color Profile Module defines the ColorProfile.class element collection. 


Collection name İ Elements in collection 
ColorProfile.class İ color-profile 





c1-- file: svg-profile.mod 


This is SVG, a language for describing tvo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), ALL Rights Reserved. 
Revision: $1d: svg-profile.mod,v 1.2 2011/07/08 03:18:59 cmccorma Exp $ 


This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//3C///ELEMENTS SVG 1.1 Color Profile//EN" 
SYSTEM "http: / /vuv/.vV3.org/Graphics/SVG/1.1/DTD/svg-profile.mod" 


c1-- Color Profile 
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color-profile 


This module declares markup to provide support for color profile. 
--- 


c1-- Qualified Names (Default) ......................... -- 
€lENTİTY 55 SVG.color-profile.qname "color-profile" s 
c1-- Attribute Collections (Default) ................... -- 


€IENTİTY 55 SVG.Core.attrib "" s 
€lENTİTY $ SVG.XLink.attrib "" s 


€1-- SVG.ColorProfile.class ............................ -- 





€lENTİTY 55 SVG.ColorProfile.extra.class "" s 


€lENTİTY 55 SVG.ColorProfile.class 
"1 S5SVG.color-profile.qname, S:SVG.ColorProfile.extra.class," 
z 


€1-- SVG.ColorProfile.attrib ........................... --- 
€lENTİTY $ SVG.ColorProfile.extra.attrib "" s 


€lENTİTY $ SVG.ColorProfile.attrib 
"color-profile CDATA £FTMPLIED 
555VG.ColorProfile.extra.attrib," 
z 


c1-- color-profile: Color Profile Element .............. --5 
€1ENTİTY 55 SVG.color-profile.extra.content "" s 


€IENTİTY 55 SVG.color-profile.element "INCLUDE" 5 
el İ55SVG. color-profile.element, 1 
€lENTİTY 55 SVG.color-profile.content 

"( SSVG.Description.class, 9S:8VG.color-profile.extra.content, )”" 
.. 
€ ELEMENT “:SVG. color-profile.qname, 5S:SVG.color-profile.content, x 
c1-- end of SVG.color-profile.element --x11- 


€IENTİTY $ SVG.color-profile.attlist "INCLUDE" 5 
cl 85SVG.color-profile.attlist,l 
€ ATTLIST S:SVG. color-profile.qname, 
S5SVG.Core.attrib, 
S5SV6.XLink.attrib, 
Vocal CDATA £TMPLTED 
name CDATA 3“REQUTRED 
rendering-intent ( auto /I perceptual Il relative-colorimetric 1 saturation 1 
absolute-colorimetric ) "auto" 





- 
c1-- end of SVG.color-profile.attlist --s115 


c1-- end of svg-profile.mod --s 


A.3.27 Gradient Module 


The Gradient Module defines the Gradient.class element collection and the Gradient.attrib attribute set. 


Collection name Elements in collection 
Gradient.class linearGradient, radialGradient 


Collection name İ Attributes in collection 
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Gradient.attrib stop-color, stop-opacity 


c1-- file: svg-gradient.mod 





This is SVG, a language for describing tuvo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), All Rights Reserved. 
Revision: $1d: svg-gradient.mod,v 1.5 2011/07/08 03:18:59 cmccorma Exp $ 


This DTD module is identified by the PUBLIC and SYSTEM identifiers: 





PUBLIC "-//3C/ /ELEMENTS SVG 1.1 Gradient//EN" 
SYSTEM "http: / vv .v3.org/Graphics/SVG/1.1/DTD/svg-gradient.mod" 


c1-- Gradient 
linearGradient, radialGradient, stop 


This module declares markup to provide support for gradient fill. 
--- 


x1-- a cnumbers or a -percentagex --x 
€ENTİTY 55 NumberOrPercentage.datatype "CDATA" 5 


c1-- Qualified Names (Default) ......................... --5 


€IENTİTY $ SVG.linearGradient.qname "linearGradient" x 
€1ENTITY $ SVG.radialGradient.qname "radialGradient" x 
SvG 





€lENTITY $ .stop.qname "stop" 5 

c1-- Attribute Collections (Default) ................... --- 
€IENTİTY 55 SVG.Core.attrib "" s 

€lENTİTY $ SVG.Style.attrib "" s 

€IENTİTY 55 SVG.Color.attrib "" s 

€lENTİTY $ SVG.XLink.attrib "" s 

€IENTİTY 55 SVG.External.attrib "" 

sv “SVG.Gradient..s(assı: A. cu sua adası ma sədə add 5 


€lENTİTY 55 SVG.Gradient.extra.class "" s 


€lENTİTY 55 SVG.Gradient.class 
"1 S5SVG.linearGradient .qname, 1 S5SVG. radialGradient.qname, 
Se5SVG.Gradient.extra.class," 
- 


e1-- SVG.Gradient.attrib ............................... 5 
€lENTİTY $ SVG.Gradient.extra.attrib "" s 
€IENTİTY $ SVG.Gradient.attrib 
"stop-color SSVGColor.datatype, £IMPLIED 
stop-opacity SÜüpacityValue.datatype, 2£1MPLIED 
Ss5SVG.Gradient.extra.attrib," 
z 
c1-- linearGradient: Linear Gradient Element ........... -- 


€IENTİTY $ SVG.linearGradient.extra. content "" s 


€IENTİTY $ SVG.linearGradient.element "INCLUDE" 5 
el 19SVG.linearGradient element, 1 
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€lENTİTY $ SVG.linearGradient.content 
"( S5SVG.Description.class, İl 5S5SVG.stop.qname, 1 5S5SVG.animate . qname, 
İ “5SVG.set .qname, 1 S5SVG.animateTransform.qname , 
358VG.linearGradient.extra.content, )“" 


z 
€ ELEMENT 5:SVG.linearGradient.qname, S:S5VG.linearGradient content, x 
c1-- end of SVG.linearGradient element --s115 


€IlENTİTY $ SVG.linearGradient.attlist "INCLUDE" 5 
cl 855SVG.linearGradient.attlist,1 
€1ATTLIST S:SVG.linearGradient.qname, 
S5SVG.Core.attrib, 
S5SVG.Style.attrib, 
S58VG.Presentation.attrib, 
S5SV6.XLink.attrib, 
S5SVG.External.attrib, 
x1 $5Coordinate.datatype, £1MPLIED 
y1 "sCoordinate.datatype, “TMPLIED 
x2 ssCoordinate.datatype, “TMPLIED 
y2 "sCoordinate.datatype, ““TMPLIED 
gradientUnits ( userSpaceOnUse 1 obiectBoundingBox ) £IMPLTED 
gradientTransform ““TransformList.datatype, £IMPLTIED 
spreadMethod ( pad İl reflect I repeat ) £IMPLIED 
z 
c€1-- end of SVG.linearGradient.attlist --sll- 


c1-- radialGradient: Radial Gradient Element ........... --- 
€IENTİTY 55 SVG.radialGradient.extra. content "" s 


€lENTİTY $ SVG.radialGradient.element "INCLUDE" 5 
cl İ55SVG. radialGradient element, 1 
€lENTİTY $ SVG.radialGradient.content 
"( S5SVG.Description.class, İl 5:8VG.stop.qname, 1 S5SVG.animate. qname, 
İ “5SVG.set .qname, 1 S55VG.animateTransform.qname 
358VG.radialGradient.extra.content, )“" 


z 
€ ELEMENT 5:SVG. radialGradient .qname, S:SVG. radialGradient content, x 
c1-- end of SVG.radialGradient.element --s11- 


€IENTİTY $ SVG.radialGradient.attlist "INCLUDE" x 
cl İ85SVG. radialGradient.attlist, 1 
€ 1ATTLIST S:SVG.radialGradient.qname, 
S5SVG.Core.attrib, 
S5SVG.Style.attrib, 
S58VG.Presentation.attrib, 
S5SV6.XLink.attrib, 
S5SVG.External.attrib, 
cx SiCoordinate.datatype, “£TMPLIED 
cy s5Coordinate.datatype, £1MPLTED 
r ssLength.datatype, £1MPLTED 
fx s5Coordinate.datatype, £1MPLTED 
Ty s“Coordinate.datatype, £1MPLTED 
gradientUnits ( userSpaceOnUse 1 obfiectBoundingBox ) £IMPLTED 
gradientTransform ““TransformList.datatype, £IMPLTIED 
spreadMethod ( pad İl reflect Il repeat ) £IMPLIED 
z 
c1-- end of SVG.radialGradient.attlist --sll- 


e1-- stop: Stop Element -.... əəə əə sz Şeyda paıaaı --- 
€lENTİTY 55 SVG.stop.extra. content "" s 


€IENTİTY 55 SVG.stop.element "INCLUDE" x 
el İ55SVG. stop.element, 1 
€ENTİTY 55 SVG.stop.content 
"( S5SVG.animate .qname, 1 5S5SVG.set.qname, 1 S5SVG.animateColor .qname, 
35SVG.stop.extra.content, )”" 
- 
€ ELEMENT 55SVG. stop .qname, S5SVG.stop.content, xs 
c1-- end of SVG.stop.element --x11- 


€IENTİTY $ SVG.stop.attlist "INCLUDE" x 

cl İ8SVG.stop.attlist,l 

€ ATTLIST S5SVG.stop.qname, 
S58VG.Core.attrib, 
S58VG.Style.attrib, 


S58VG.Presentation.attrib, 
offset s5NumberOrPercentage.datatype, 2/REQUTRED 
z 


c1-- end of SVG.stop.attlist --s11- 


x1-- end of svg-gradient.mod --5 
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A.3.28 Pattern Module 


The Pattern Module defines the Pattern.class element collection. 


Elements in collection 





c1-- file: svg-pattern.mod 
This is SVG, a language for describing tvo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), ALL Rights Reserved. 
Revision: $1d: svg-pattern.mod,v 1.3 2011/07/08 03:18:59 cmccorma Exp $ 
This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//3C//ELEMENTS SVG 1.1 Pattern//EN" 
SYSTEM "http: / /vvv/.vV3.orTg/Graphics/SVG/1.1/DTD/svg-pattern.mod" 


c1-- Pattern 
pattern 


This module declares markup to provide support for pattern fil1. 
--- 


c1-- Qualified Names (Default) ......................... --- 


€ENTİTY 55 SVG.pattern.qname "pattern" x 


c1-- Attribute Collections (Default) ................... --- 
€lENTİTY 55 SVG.Core.attrib "" s 
€lENTİTY 55 SVG.Container.attrib "" s 
€IENTİTY $ SVG.Conditional.attrib "" s 
€IENTİTY $ SVG.Style.attrib "" s 
€IENTİTY $ SVG.Vievport.attrib "" 
€lENTİTY $ SVG.Text.attrib "" s 
€IENTİTY $ SVG.TextContent.attrib "" s 
€IENTİTY $ SVG.Font.attrib "" s 
€lENTİTY $ SVG.Paint.attrib "" s 
€ENTİTY 55 SVG.Color.attrib "" s 
€IENTİTY $ SVG.Üpacity.attrib "" s 
€IENTİTY $ SVG.Graphics.attrib "" s 
€lENTİTY 55 SVG.Marker.attrib "" s 
€lENTİTY $ SVG.ColorProfile.attrib "" s 
€IENTİTY $ SVG.Gradient.attrib "" 
€IENTİTY $ SVG.Clip.attrib "" s 
€IENTİTY 55 SVG.Mask.attrib "" s 
€lENTİTY $ SVG.Filter.attrib "" s 
€IENTİTY $ SVG.FilterColor.attrib "" s 
€lENTİTY 55 SVG.Cursor.attrib "" s 
€lENTİTY $ SVG.XLink.attrib "" s 
€IENTİTY 5 SVG.External.attrib "" 
€1-- SVG.Pattern.class ................................. --- 


€IENTİTY 55 SVG.Pattern.extra.class "" s 


€VENTİTY 55 SVG.Pattern.class 
"1 S5SVG.pattern.qname, 5:5VG.Pattern.extra.class," 


z 


e1-- SVG.Presentation.attrib ........................... --- 


€IENTİTY $ SVG.Presentation.extra.attrib "" s 
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€lENTİTY $ SVG.Presentation.attrib 
"SSVG.Container.attrib, 
358VG.Vieuvport.attrib, 
958VG.Text.attrib, 
558VG.TextContent.attrib, 
358VG.Font.attrib, 
958VG.Paint.attrib, 
358VG.Color.attrib, 
555VG.Opacity.attrib, 
358VG.Graphics.attrib, 
558VG.Marker.attrib, 
358VG.ColorProfile.attrib, 
S58VG.Gradient.attrib, 
3558VG.Clip.attrib, 
558VG.Mask.attrib, 
S58VG.Filter.attrib, 
358VG.FilterColor.attrib, 
358VG.Cursor.attrib, 
T1ood-color 5sSVGColor.datatype, £1MPLIED 
T1ood-opacity 5Ss0pacityValue.datatype, £1MPLTED 
lighting-color S5:SVGColor.datatype, £TMPLTED 
358VG.Presentation.extra.attrib," 





z 
c1-- pattern: Pattern Element .......................... --5 
€lENTİTY 55 SVG.pattern.extra.content "" s 


€1ENTİTY 55 SVG.pattern.element "INCLUDE" 5 

cl İ55SVG. pattern.element, 1 

€lENTİTY 55 SVG.pattern.content 

"( S5SVG.Description.class, 1 S5:8VG.Animation.class, 5S5SVG.Structure.class, 

555VG.Conditional.class, S:SVG.TImage. class, 55SVG.Style.class, 
35SVG ..Shape. class, S5SVG. Text. class, S5SVG.Marker.class, 
35SVG.ColorProfile. class, S5:SVG.Gradient.class, 5$5SVG.Pattern.class, 
358VG.Clip.class, 3:5VG.Mask.class, 3558VG.Filter.class, S:SVG.Cursor.class, 
555VG.Hyperlink.class, 5S:SVG.Viev.class, S58VG.Secript.class, 
558VG.Font.class, $58VG.Extensibility.class, $5SVG.pattern.extra.content, )”" 

z 

€ ELEMENT 5:SVG. pattern. name, 555VG.pattern.content, x 

c1-- end of SVG.pattern.element --c11- 


€lENTİTY $ SVG.pattern.attlist "INCLUDE" 5 
cl İ8SVG.pattern.attlist,l 
€ ATTLIST 5:SVG.pattern.qname, 
S5SVG.Core.attrib, 
S5SVG.Conditional.attrib, 
S58VG.Style.attrib, 
S58VG.Presentation.attrib, 
S5SV6.XLink.attrib, 
S5SVG.External.attrib, 
x sseCoordinate.datatype, £IMPLIED 
y ssCoordinate.datatype, £IMPLIED 
vidth "sLength.datatype, £1MPLTED 
height s:Length.datatype, £1MPLTED 
patternUnits ( userSpaceünUse 1 obfiectBoundingBox ) £IMPLTED 
patternContentUnits ( userSpacetnUse 1 obfiectBoundingBox ) £1MPLTED 
patternTransform “:TransformList.datatype, £1MPLTED 
vievBox SsVievBoxSpec.datatype, “£TIMPLIED 
preserveAspectRatio 5:PreserveAspectRatioSpec.datatype, "xMidYMid meet" 
z 
c1-- end of SVG.pattern.attlist --s11- 


c1-- end of svg-pattern.mod --s5 


A.3.29 Clip Module 


The Clip Module defines the Clip.class element collection and the Clip.attrib attribute collection. 


Collection name İ Elements in collection 
clipPath 
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Collection name İ Attributes in collection 
Clip.attrib clip-path, clip-rule 


SUZ ə AZ R 0 ZA LL ÜZ ə --- 
el--.SV6 1.1 Clip, Module :....: əəə əəə ba ka adda odda Ra sls alıaı Ra Rss bs --- 
c1-- file: svg-clip.mod 





This is SVG, a language for describing tvo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), ALL Rights Reserved. 
Revision: $Id: svg-clip.mod,v 1.4 2011/07/08 03:18:58 cmccorma Exp $ 


This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//3C//ELEMENTS SVG 1.1 Clip//EN" 
SYSTEM "http: / /vvv/..vV3.org/Graphics/SVG/1.1/DTD/svg-clip.mod" 


c1-- Clip 
clipPath 


This module declares markup to provide support for clipping. 
-- 


c1-- "clip-path" property/attribute value (e.g., "none", curis) --s 
€lENTİTY $ ClipPathValue.datatype "CDATA" x 


c1-- Qualified Names (Default) ......................... --5 
€IENTİTY $ SVG.clipPath.qname "clipPath" x 
c1-- Attribute Collections (Default) ................... 85 


SIENTİTY 
SIENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
SIENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
SIENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 


SVG.Core.attrib "" s 
SVG.Conditional.attrib "" s 
SVG.Style.attrib "" s 
SVG.Text.attrib "" s 
SVG.TextContent.attrib "" s 
SVG.Font.attrib "" s 
SVG.Paint.attrib "" 5 
SVG.Color.attrib "" s 
SVG.Opacity.attrib "" s 
SVG.Graphics.attrib "" s 
SVG.Mask.attrib "" s 
SVG.Filter.attrib "" s 
SVG.Cursor.attrib "" s 
SVG.External.attrib "" s 


9? 99 9? o? o? Ə? Ə? 0? 0? ÖP o? o? o? op 


el-- SV6:Clipielass sou yaaa a şı Ra ə R AR sasRaEŞsəiı -- 
€lENTİTY $ SVG.Clip.extra.class "" s 
€IENTİTY $ SVG.Clip.class 

"1 S5SVG.clipPath.qname, S55VG.Clip.extra.class," 


z 


sil-- SVG.Ctip.attrib nü əə əəə Ra Ya ƏR dədəsi 2-5 


€IENTİTY $ SVG.Clip.extra.attrib "" 


€IENTİTY $ SVG.Clip.attrib 
"clip-path ssClipPathValue.datatype, £IMPLIED 
clip-rule sClipFillRule.datatype, £IMPLIED 
358VG.Clip.extra.attrib," 

z 
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c1-- clipPath: Clip Path Element ....................... --- 
€IENTİTY $ SVG.clipPath.extra. content "" s 


€lENTİTY $ SVG.clipPath.element "INCLUDE" 5 
cl (55VG.clipPath element, 1 
€IENTİTY $ SVG.clipPath.content 
"( S5SVG.Description.class, 1 5:8VG.Animation.class, 5S5SVG.Use.class, 
555VG.Shape. class, 1 S:SVG.text.qname, 5:5VG.clipPath.extra.content, )”" 
z 
€ ELEMENT 5:SVG.clipPath.qname, 5S:5VG.clipPath.content, xs 
c1-- end of SVG.clipPath.element --s115 


€lENTİTY $ SVG.clipPath.attlist "INCLUDE" 5 
cl SSVG.clipPath.attlist,1 
€ IATTLIST S:SVG.clipPath ..qname, 
S5SVG.Core.attrib, 
S5SVG.Conditional.attrib, 
S5SVG.Style.attrib, 
S58VG.Presentation.attrib, 
S5SVG.External.attrib, 
transform S:TransformList.datatype, £1MPLTED 
clipPathUnits ( userSpacetOnUse Il obiectBoundingBox ) £T1MPLIED 





z 
c1-- end of SVG.clipPath.attlist --s11- 


c1-- end of svg-clip.mod --x 


A.3.30 Basic Clip Module 


"The Basic Clip Module defines the Clip.class element collection and the Clip.attrib attribute collection. 


Collection name İ Elements in collection 
clipPath 


Collection name İ Attributes in collection 
Clip.attrib clip-path, clip-rule 





50077 7”. ”.”.. --- 
€1-- SVG 1.1 Basic Clip Module ............................................. --- 
c1-- file: svg-basic-clip.mod 


This is SVG, a language for describing tvo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), ALL Rights Reserved. 
Revision: $1d: svg-basic-clip.mod,v 1.4 2011/07/08 03:18:58 cmccorma Exp $ 
This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//M3C//ELEMENTS SVG 1.1 Basic Clip//EN" 
SYSTEM "http: / /vvv..vV3.org/Graphics/SVG/1.1/DTD/svg-basic-clip.mod" 


c1-- Basic Clip 


clipPath 
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This module declares markup to provide support for clipping. 
--- 


c1-- "clip-path" property/attribute value (e.g., "none", curis) --s 
€lENTİTY $ ClipPathValue.datatype "CDATA" 5 


c1-- Qualified Names (Default) ......................... --- 


€IENTİTY $ SVG.clipPath.qname "clipPath" s 


c1-- Attribute Collections (Default) ................... --- 
€IENTİTY 55 SVG.Core.attrib "" s 

€IENTİTY $ SVG.Conditional.attrib "" s 

€lENTİTY $ SVG.Style.attrib "" s 

€IENTİTY $ SVG.Text.attrib "" s 

€IENTİTY $ SVG.TextContent.attrib "" s 

€lENTİTY $ SVG.Font.attrib "" s 

€lENTİTY $ SVG.Paint.attrib "" s 

€IENTİTY 55 SVG.Color.attrib "" s 

€IENTİTY $ SVG.Üpacity.attrib "" s 

€IENTİTY $ SVG.Graphics.attrib "" 

€IENTİTY $ SVG.Mask.attrib "" s 

€lENTİTY $ SVG.Filter.attrib "" s 

€lENTİTY 55 SVG.Cursor.attrib "" s 

€IENTİTY 55 SVG.External.attrib "" 

sil-— SV.GLip.class ipaı OL RİRRRŞ Şa Şa ŞƏ RŞƏq --- 


€IENTİTY $ SVG.Clip.extra. class "" s 


€IENTİTY $ SVG.Clip.class 
"1 S5SVG.clipPath.qname, S55VG.Clip.extra.class," 
z 


el-- SVG.Clip.-attrib sü üə aş YRD REY SSPRŞR9 --5 
€IENTİTY $ SVG.Clip.extra.attrib "" s 


€IENTİTY $ SVG.Clip.attrib 
"clip-path SClipPathValue.datatype, “IMPLIED 
clip-rule sClipFillRule.datatype, £TIMPLIED 
358VG.Clip.extra.attrib," 

- 


c1-- clipPath: Clip Path Element ....................... --5 
€lENTİTY 55 SVG.clipPath.extra. content "" s 


€lENTİTY $ SVG.clipPath.element "INCLUDE" 5 
cl 855VG.clipPath element, 1 
€lENTİTY $ SVG.clipPath.content 
"( S5SVG.Description.class, 1 5S5:SVG.Animation.class, S5SVG.Use.class, 
555VG.Shape . class, İl S:SVG.text.qname, 5S5:SVG.clipPath.extra.content, 
z 
€ ELEMENT 5S:SVG.clipPath.qname, 5S:SVG.clipPath.content, xs 
c1-- end of SVG.clipPath.element --s11- 


€lENTİTY $ SVG.clipPath.attlist "INCLUDE" 5 
e185SVG.clipPath.attlist,1 
€1ATTLIST S:SVG.clipPath .qname , 
S5SVG.Core.attrib, 
S5SVG.Conditional.attrib, 
S58VG.Style.attrib, 
S658VG.Presentation.attrib, 
S5SVG.External.attrib, 
transform 5:TransformList.datatype, £1MPLTED 
clipPathUnits ( userSpacetOnUse / obiectBoundingBox ) ““TMPLTED 
z 
c1-- end of SVG.clipPath.attlist --slls 


c1-- end of svg-basic-clip.mod --5 


ye 


A.3.31 Mask Module 


The Mask Module defines the Mask.class element collection and the Mask.attrib attribute collection. 


Collection name İ Elements in collection 
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Collection name İ Attributes in collection 


S XL YU a ZA LL UL Dİ --- 
el--:V6:1-1 Mask Modute: əəə ass Rada R sə Rai XRSRRRədəəğı --- 
c1-- file: svg-mask.mod 





This is SVG, a language for describing tvo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), ALL Rights Reserved. 
Revision: $1d: svg-mask.mod,v 1.3 2011/07/08 03:18:59 cmccorma Exp $ 


This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//3C/ /ELEMENTS SVG 1.1 Mask//EN" 
SYSTEM "http: / /vvv/..vV3.org/Graphics/SVG/1.1/DTD/svg-mask.mod" 


c1-- Mask 
mask 


This module declares markup to provide support for masking. 
--- 


c1-- "mask" property/attribute value (e.g., "none", curis) --s 
€1ENTİTY 55 MaskValue.datatype "CDATA" 5 


c1-- Qualified Names (Default) ......................... --5 
€VENTİTY 55 SVG.mask.qname "mask" 5 
c1-- Attribute Collections (Default) ................... 85 


€IENTİTY 
SIENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
SIENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
SIENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 


SVG.Core.attrib "" s 
SVG.Container.attrib "" 5 
SVG.Conditional.attrib "" s 
SVG.Style.attrib "" 
SVG.Vievport.attrib "" s 
SVG.Text.attrib "" s 
SVG.TextContent.attrib "" s 
SVG.Font.attrib "" s 
SVG.Paint.attrib "" 5 
SVG.Color.attrib "" s 
SVG.Opacity.attrib "" 5 
SVG.Graphics.attrib "" s 
SVG.Marker.attrib "" 
SVG.ColorProfile.attrib "" s 
SVG.Gradient.attrib "" s 
SVG.Clip.attrib "" x 
SVG.Filter.attrib "" 
SVG.FilterColor.attrib "" s 
SVG.Cursor.attrib "" s 
SVG.External.attrib "" s 


99 99 0? o? 9? Ə? 9? 09 0? 0? ÖP 9? Ə? Ə? 0? 0? o? o? od? ap 


el-- SV6:Mask..€lassi ....u şə saa Rama BARA Raya ESR da Pasa Ray AZRARASIDASaRB -- 


€lENTİTY 55 SVG.Mask.extra. class "" s 


€ VENTİTY 5. SVG.Mask.class 
"1 55SVG.mask .qname, 55SVG.Mask.extra.class," 
z 


sil-- “SVü.Mask.attrib uu ə əəə sa ğa asa esddsads --- 


€IENTİTY $ SVG.Mask.extra.attrib "" s 
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€IENTİTY $ SVG.Mask.attrib 
"mask s:MaskValue .datatype, £1MPLTED 
558VG.Mask.extra.attrib," 

- 


e€1-- SVG.Presentation.attrib ........................... -- 
€IENTİTY $ SVG.Presentation.extra.attrib "" s 


€IENTİTY $ SVG.Presentation.attrib 
"SSVG.Container.attrib, 
358VG.Vieuvport.attrib, 
558VG.Text.attrib, 
558VG.TextContent.attrib, 
958VG.Font.attrib, 
358VG.Paint.attrib, 
558VG.Color.attrib, 
555VG.Opacity.attrib, 
358VG.Graphics.attrib, 
358VG.Marker.attrib, 
358VG.ColorProfile.attrib, 
358VG.Gradient.attrib, 
358V6.Clip.attrib, 
358VG.Mask.attrib, 
S58VG.Filter.attrib, 
S58V6.FilterColor.attrib, 
358VG.Cursor.attrib, 
T1ood-color S:SVGColor.datatype, £1MPLTED 
T1ood-opacity 5$s0pacityValue.datatype, £T1MPLTED 
lighting-color S5SVGColor.datatype, £TMPLTED 
358VG.Presentation.extra.attrib," 





z 
e1-- mask: Mask Element ................................ --- 
€ENTİTY 55 SVG.mask.extra. content "" s 


€1ENTİTY 55 SVG.mask.element "İNCLUDE" x 

el İS5SVG.mask.element, 1 

€1ENTİTY 55 SVG.mask.content 

"( S5SVG.Description.class, 1 S5:8VG.Animation.class, 5S5SVG.Structure.class, 

555VG.Conditional.class, S:SVG.TImage. class, 55SVG.Style.class, 
35SVG .Shape.. class, S5SVG. Text.class, S5SVG.Marker.class, 
35SVG.ColorProfile. class, S5:SVG.Gradient.class, 55SVG.Pattern.class, 
358VG.Clip.class, 3:5VG.Mask.class, 3:58VG.Filter.class, S:SVG.Cursor.class, 
555VG.Hyperlink.class, 5S:SVG.Viev.class, S58VG.Secript.class, 
358VG.Font.class, 958VG.Extensibility.class, $5SVG.mask.extra.content, )”" 


z 
e ELEMENT 55SVG ..mask..qname, S5SVG.mask.. content, xs 
c1-- end of SVG.mask.element --x115 


€IENTİTY $ SVG.mask.attlist "INCLUDE" x 
cl İ8SVG.mask.attlist,l 
€ ATTLIST S:SVG.mask.qname, 
S5SVG.Core.attrib, 
S5VG.Conditional.attrib, 
S58VG.Style.attrib, 
S58VG.Presentation.attrib, 
S5SVG.External.attrib, 
x 55Coordinate.datatype, £IMPLTIED 
y s:Coordinate.datatype, £TIMPLTIED 
vidth "sLength.datatype, £1MPLTED 
height s:Length.datatype, £1MPLTED 
maskUnits ( userSpacetOnUse 1 obfiectBoundingBox ) ZTMPLTED 
maskContentUnits ( userSpacetnUse 1 obfectBoundingBox ) £1MPLTED 
z 
c1-- end of SVG.mask.attlist ---1l- 


c1-- end of svg-mask.mod --x 
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A.3.32 Filter Module 


The Filter Module defines the Filter.class and FilterPrimitive.class element collections and the Filter.attrib, Filter- 
Color.attrib, FilterPrimitive.attrib and FilterPrimitiveVVithln.attrib attribute collections. 


Collection name Elements in collection 


FilterPrimitive.class İ feBlend, feFlood, feColorMatrix, feComponentTransfer, feComposite, feConvolveMatrix, 
feDiffuseLighting, feDisplacementMap, feGaussianBlur, felmage, feMerge, feMorpholooy, 
feOffset, feSpecularLighting, feTile, feTurbulence 





00000 --- 
el-- SVG 1-4 Fktter Mödule: üə ə maz ala a YR Ra ə Ab OZ ER əd ee şeiy --- 
c1-- file: svg-filter.mod 


This is SVG, a language for describing tuo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), All Rights Reserved. 
Revision: $I1d: svg-filter.mod,v 1.6 2011/07/08 03:18:58 cmccorma Exp $ 


This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//3C//ELEMENTS SVG 1.1 Filter//EN" 
SYSTEM "http: / /vvv/.v3.org/Graphics/SVG/1.1/DTD/svg-filter.mod" 


c1-- Filter 


filter, feBlend, feColorMatrix, feComponentTransfer, feComposite, 
feConvolveMatrix, feDiffuseLighting, feDisplacementMap, fTfeFlood, 
TfeGaussianBlur, felmage, feMerge, feMergeNode, feMorpholoogy, fe0ffset, 
feSpecularLighting, feTile, feTurbulence, feDistantLight, fePointLight, 
feSpotLight, feFuncR, feFuncG, feFuncB, feFuncA 


This module declares markup to provide support for filter effect. 
--- 


c1-- "filter" property/attribute value (e.g., "none", curis) --s 
€lENTİTY $ FilterValue.datatype "CDATA" x 


c€1-- list of -numberss, but at least one and at most tvo --x 
€VENTİTY 5 NumberOptionalNumber .datatype "CDATA" 5 


c1-- Qualified Names (Default) ......................... --5 


€IENTİTY 
€lENTİTY 
€IENTİTY 
€lENTİTY 
€IENTİTY 
€lENTİTY 
€lENTİTY 


SVG.filter.qname "filter" x 

SVG. feBlend.qname "feBlend" 5 

SVG.fTfeColorMatrix.qname "feColorMatrix" x 

SVG. feComponentTransfer.qname "feComponentTransfer" x 
SVG. feComposite.qname "feComposite" x 

SVG. feConvolveMatrix.qname "feConvolveMatrix" s 
SVG.feDiffuseLighting.qname "feDiffuseLighting" x 


9? 99 0? o? o? o? op 
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€ENTİTY 55 SVG.feDisplacementMap .qname "feDisplacementMap" x 
€ ENTİTY 55 SVG.feFlood.qname "feFlood" 5 

€1ENTİTY 55 SVG. feGaussianBlur.qname "TeGaussianBlur" xs 
€IENTİTY $ SVG.felmage.qname "felmage" 5 

€ VENTİTY 5: SVG. feMerge.qname "feMerge" 5 

€ VENTİTY 5: SVG. feMergeNode .qname "TeMergeNode" 5 

€ VENTİTY 55 SVG. feMorphology.qname "TeMorphology" xs 

€ ENTİTY 55 SVG.feO0ffset.qname "fTe0ffset" s 

€IENTİTY 55 SVG.feSpecularLighting.qname "feSpecularLighting" xs 
€IENTİTY $. SVG.feTile.qname "feTile" 5 

€ ENTİTY 55 SVG. feTurbulence .qname "TeTurbulence" xs 

€IENTİTY $ SVG.feDistantLight.qname "TeDistantLight" x 
€IENTİTY $ SVG.fePointLight.qname "fePointLight" s 

€IENTİTY 55 SVG.feSpotLight.qname "feSpotLight" xs 

€ 1ENTİTY 55 SVG.feFuncR.qname "feFuncR" 5 

€ENTİTY 55 SVG.feFuncG. name "fTeFuncG" 5 

€ENTİTY 55 SVG. feFuncB.qname "feFuncB" 5 

€ENTİTY 55 SVG.feFuncA. qname "feFuncA" 5 

c1-- Attribute Collections (Default) ................... --5 
€lENTİTY 55 SVG.Core.attrib "" s 

€lENTİTY 55 SVG.Container.attrib "" s 

€lENTİTY $ SVG.Style.attrib "" s 

€IENTİTY $ SVG.Vievport.attrib "" 

€lENTİTY $ SVG.Text.attrib "" s 

€IENTİTY $ SVG.TextContent.attrib "" s 

€IENTİTY $ SVG.Font.attrib "" s 

€lENTİTY $ SVG.Paint.attrib "" s 

€lENTİTY 55 SVG.Color.attrib "" s 

€IENTİTY $ SVG.Üpacity.attrib "" s 

€IENTİTY $ SVG.Graphics.attrib "" s 

€lENTİTY 55 SVG.Marker.attrib "" s 

€lENTİTY $ SVG.ColorProfile.attrib "" s 

€IENTİTY $ SVG.Gradient.attrib "" 

€lENTİTY $ SVG.Clip.attrib "" s 

€IENTİTY 55 SVG.Mask.attrib "" s 

€lENTİTY 55 SVG.Cursor.attrib "" s 

€lENTİTY $ SVG.XLink.attrib "" s 

€IENTIİTY $ SVG.XLinkEmbed.attrib "" s 

€IENTİTY $ SVG.External.attrib "" 

xil “5VG.FTUtericilassi iə dələ sz s yadı s sv sblebd s 5 


€IENTİTY $ SVG.Filter.extra.class "" s 


€IENTİTY 5 SVG.Filter.class 
"1 SSVG.filter.qname, S55VG.Filter.extra.class," 


z 


c1-- SVG.FilterPrimitive.class ......................... --5 


€IENTİTY $ SVG.FilterPrimitive.extra.class "" s 


€lENTİTY $ SVG.FilterPrimitive.class 


"5SVG. 
"5SVG. 


TeBlend.qname, 1 5“:SVG.feColorMatrix.qname, 
TeComponentTransfer.qname, 1 5:5VG. feComposite .qname, 


l 
İ “5SVG. feConvolveMatrix.qname, 1 5:SVG.feDiffuseLighting .qname, 
İ “5SVG.feDisplacementMap .qname, 1 5:SVG. feFlood.qname , 
İ “5SVG. feGaussianBlur .qname, 1 S:5VG. felmage .qname, 1 “:SVG. feMerge.qname, 
İ “5SVG. feMorphology .qname, 1 “:5VG. fe0Tfset.qname, 
İ “5SVG.feSpecularLighting .qname, 1 S:SVG. feTile.qname, 
İ “5SVG.feTurbulence.qname, 5:8V6.FilterPrimitive.extra.class," 
z 
sız SVö:Fittervattrib qusu spa Şa san aşşaasasasə 5 


€IENTİTY $ SVG.Filter.extra.attrib "" s 


€lENTİTY $ SVG.Filter.attrib 
"filter sFilterValue.datatype, £1MPLIED 
35V6G.Filter.extra.attrib," 


z 


el-- SVG.FilterColor.attrib ...:....9.s9uuuusəşusuusu.u 3 --5 


€lENTİTY $ SVG.FilterColor.extra.attrib "" s 


€IENTİTY $ SVG.FilterColor.attrib 
"color-interpolation-filters ( auto 1/1 sRGB / linearRGB 1 inherit ) 
£FIMPLIED 
358VG.FilterColor.extra.attrib," 
- 


c1-- SVG.FilterPrimitive.attrib ........................ --- 


c 
.Ə 
5 
İv) 
m") 
(s 
(3) 
z 
E 
ə) 
(ə) 
o 
ad 
. 
s 


€IENTİTY $ SVG.FilterPrimitive.extra.attrib "" s 


€IENTİTY $ SVG.FilterPrimitive.attrib 
"x ssCoordinate.datatype, £1MPLTED 
y “:Coordinate.datatype, “TMPLIED 
vidth "sLength.datatype, £1MPLTED 
height ssLength.datatype, £1MPLIED 
result CDATA £IMPLIED 
35V6.FilterPrimitive.extra.attrib," 
z 


c1-- SVG.FilterPrimitiveMithin.attrib .................. --- 


€IENTİTY $ SVG.FilterPrimitiveMNithln.extra.attrib "" 





€IENTİTY $ SVG.FilterPrimitiveMNithln.attrib 
"SSVG.FilterPrimitive.attrib, 
in CDATA £IMPLIED 
35V6G.FilterPrimitiveNithiIn.extra.attrib," 
z 


e€1-- SVG.Presentation.attrib ........................... --- 
€IENTİTY $ SVG.Presentation.extra.attrib "" s 


€lENTİTY $ SVG.Presentation.attrib 
"SSVG.Container.attrib, 
358VG.Vieuvport.attrib, 
958VG.Text.attrib, 
558VG.TextContent.attrib, 
958VG.Font.attrib, 
9558VG.Paint.attrib, 
358VG.Color.attrib, 
555VG.Opacity.attrib, 
358VG.Graphics.attrib, 
555VG.Marker.attrib, 
358VG.ColorProfile.attrib, 
358VG.Gradient.attrib, 
358V6.Clip.attrib, 
555VG.Mask.attrib, 
S58VG.Filter.attrib, 
358VG.FilterColor.attrib, 
358VG.Cursor.attrib, 
T1ood-color $sSVGColor..datatype, £T1MPLTED 
T1ood-opacity 5$s0pacityValue.datatype, £1MPLTED 
lighting-color S5SVGColor.datatype, £TMPLTED 
358VG.Presentation.extra.attrib," 

ka 


e1-- filter: Filter Element ............................ -- 
€IENTİTY $ SVG.filter.extra. content "" s 


€lENTİTY $ SVG.filter.element "INCLUDE" x 
el 85SVG.filter element, 1 
€IENTİTY $ SVG.filter.content 
"( SSVG.Description.class, 555VG..animate .qname, 1 S:SVG. set .qname, 
35SVG.FilterPrimitive.class, SSVG.filter.extra.content, )“" 





- 
€ ELEMENT S:SVG.filter.qname, S:$VG.filter.content, 5 
c1-- end of SVG.filter.element --s115 


€lENTİTY $ SVG.filter.attlist "INCLUDE" x 

c1İ8SVG.filter.attlist,1 

€ IATTLIST S:SVG.filter.qname, 
S5SVG.Core.attrib, 
S58VG.Style.attrib, 
S58VG.Presentation.attrib, 


S5SV6.XLink.attrib, 

S5SVG.External.attrib, 

x ssCoordinate.datatype, £IMPLIED 

y sseCoordinate.datatype, £IMPLIED 

vidth "sLength.datatype, £1MPLTED 

height s:Length.datatype, £1MPLTED 

filterRes ":NumberOptionalNumber .datatype, £T1MPLTED 

filterUnits ( userSpaceOnUse 1 obfiectBoundingBox ) £TIMPLIED 
primitiveUnits ( userSpaceOnUse 1 obfiectBoundingBox ) £IMPLIED 
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- 
c1-- end of SVG.filter.attlist --sll 


c1-- feBlend: Filter Effect Blend Element .............. --- 
€ENTİTY 55 SVG.feBlend.extra content "" s 


€ENTİTY 55 SVG.feBlend.element "INCLUDE" 5 
cl İ55SVG. feBlend. element, 1 
€1ENTİTY 55 SVG.feBlend.content 
"( S5SVG.animate .qname, 1 5S:SVG.set.qname, “:SVG. feBlend.extra.content, )”" 
z 
€ ELEMENT S:SVG. feBlend ..qname , S:SVG. feBlend. content, 5 
c1-- end of SVG.feBlend.element --x115 





€IENTİTY $ SVG.feBlend.attlist "INCLUDE" x 
cl 1555VG. feBlend.attlist,l 
€ ATTLIST S:SVG. feBlend..qname , 
S5SVG.Core.attrib, 
S5SVG.Style.attrib, 
S58VG.Presentation.attrib, 
SSV6.FilterPrimitiveMithin.attrib, 
in2 CDATA £REQUTRED 
mode ( normal / multiply 1 screen l darken 1 lighten ) "normal" 
z 
c1-- end of SVG.feBlend.attlist --c11- 


c1-- feColorMatrix: Filter Effect Color Matrix Element . --x 
€lENTİTY 55 SVG.feColorMatrix.extra.content "" s 


€IENTİTY $ SVG.feColorMatrix.element "INCLUDE" x 
cl İ55SVG. feColorMatrix.element, 1 
€lENTİTY 5 SVG.feColorMatrix.content 
"( S5SVG.animate .qname, 1 S:SVG.set.qname, 
S58VG.feColorMatrix.extra.content, )”" 
- 
€ ELEMENT S:SVG. feColorMatrix.qname, 5:5VG.feColorMatrix.content, x 
c1-- end of SVG.feColorMatrix.element --x11- 


€IENTİTY $ SVG.feColorMatrix.attlist "INCLUDE" x 
cl 85SVG.feColorMatrix.attlist,1 
€ ATTLIST S:SVG. feColorMatrix.qname 
S5SVG.Core.attrib, 
S5SVG.Style.attrib, 
S58VG.Presentation.attrib, 
sSVG6.FilterPrimitivehithin.attrib, 
type ( matrix İl saturate 1 hueRotate 1I luminanceToAlpha ) "matrix" 
values CDATA £TIMPLTED 
z 
c1-- end of SVG.feColorMatrix.attlist --c11- 


c1-- feComponentTransfer: Filter Effect Component Transfer Element --x 
€ 1ENTİTY 55 SVG. feComponentTransfer.extra. content "" s 


€ ENTİTY 55 SVG. feComponentTransfer.element "INCLUDE" x 
cl İ555VG. feComponentTransfer . element, 1 
€lENTİTY 55 SVG. feComponentTransfer.content 
"( S5SVG. feFuncR. qname, ?, 5:SVG. feFuncG6 .qname  ?, S:SVG. feFuncB .qname  ?, 
55SVG. feFuncA . qname , ? S55VG. feComponentTransfer.extra.content, )" 


z 
e ELEMENT 5:SVG. feComponentTransfer.qname, 5:SVG. feComponentTransfer.content, x 
x1-- end of SVG. feComponentTransfer.element --x11- 


€IENTİTY 55 SVG.feComponentTransfer.attlist "INCLUDE" x 
cl İ555VG. feComponentTransfer.attlist,1 
€ ATTLIST 5:SVG. feComponentTransfer.qname, 


S5SVG.Core.attrib, 
S5SVG.Style.attrib, 
S58VG.Presentation.attrib, 
SSV6.FilterPrimitivehithln.attrib, 
z 
c1-- end of SVG.feComponentTransfer.attlist --sl1- 


c1-- feComposite: Filter Effect Composite Element ...... --- 
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€IENTİTY 55 SVG.feComposite.extra.content "" s 


€IENTİTY 55 SVG.feComposite.element "INCLUDE" x 
cl İ55SVG. feComposite element, 1 
€IENTİTY 55 SVG.feComposite.content 
"( S5SVG.animate .qname, 1 “:SVG.set.qname, S:5VG. feComposite.extra.content, )”" 
z 
€ ELEMENT 5:SVG. feComposite .qname, 5:5VG. feComposite.content, x 
c1-- end of SVG. feComposite.element --s115 


€IENTİTY $ SVG.feComposite.attlist "INCLUDE" 5 
cl (555VG. feComposite.attlist,1 
€ ATTLIST 5:SVG. feComposite .qname , 
S58VG.Core.attrib, 
S5SVG.Style.attrib, 
S58VG.Presentation.attrib, 
SSVG6.FilterPrimitivehithln.attrib, 
in2 CDATA £REQUTRED 
operator ( over l in 1 out 1 atop 1 xor 1 arithmetic ) "over" 
k1 s5Number..datatype, £TMPLTED 
k2 s5Number..datatype, £TMPLTED 
k3 s5Number..datatype, £TMPLTED 
k4 s5Number..datatype, £TMPLTED 





z 
c1-- end of SVG.feComposite.attlist --s115 


c1-- feConvolveMatrix: Filter Effect Convolve Matrix Element --x 
€ENTİTY 55 SVG.feConvolveMatrix.extra.content "" s 


€ENTİTY 55 SVG.feConvolveMatrix.element "INCLUDE" 5 
cl 1555VG. feConvolveMatrix. element, 1 
€lENTİTY 55 SVG.feConvolveMatrix.content 
"( S5SVG.animate .qname, 1 S:SVG.set.qname, 
558VG.feConvolveMatrix.extra.content, )”" 


z 
€ ELEMENT 5:SVG. feConvolveMatrix.qname, 5“:5VG. feConvolveMatrix.content, x 
c1-- end of SVG.feConvolveMatrix.element --x115 


€lENTİTY $ SVG.feConvolveMatrix.attlist "INCLUDE" 5 
cl 1555VG. feConvolveMatrix.attlist,1 
€ ATTLIST S:SVG. feConvolveMatrix .qname , 
S5SVG.Core.attrib, 
S5SVG.Style.attrib, 
S58VG.Presentation.attrib, 
SSV6.FilterPrimitivehithln.attrib, 
order s:NumberOptionalNumber .datatype, £T1MPLTED 
kernelMatrix CDATA £REQUTRED 
divisor “:Number..datatype, £TIMPLTED 
bias “:Number .datatype, £1MPLTED 
targetX sInteger.datatype, £1MPLIED 
targetY sInteger.datatype, £1MPLIED 
edgeMode ( duplicate 1 uvrap İ none ) "duplicate" 
kernelUnitLength ":NumberOptionalNumber .datatype, £TMPLTED 
preserveAlpha 5:Boolean .datatype, £TMPLTED 
- 
c1-- end of SVG.feConvolveMatrix.attlist --sll- 


c1-- feDiffuseLighting: Filter Effect Diffuse Lighting Element --x 
€1ENTİTY $ SVG.feDiffuseLighting.extra.content "" s 


€1ENTİTY $ SVG.feDiffuseLighting.element "INCLUDE" 5 
cl İSSVG.feDiffuseLighting.element, 1 
€IENTİTY $ SVG.feDiffuseLighting.content 
"(( £SVG.feDistantLight.qname, 1 S:8VG.fePointLight.qname, 
1 “5SVG.feSpotLight.qname, ), ( S55VG.animate .qname, 1 S5SVG. set .qname, 
1 “5SVG.animateColor.qname, 5:5VG.TfeDiffuseLighting.extra.content, )”)" 


z 
€ 1ELEMENT 5:58VG.feDiffuseLighting.qname, 5“55VG.feDiffuseLighting.content, 5 
c1-- end of SVG.feDiffuseLighting.element --s11- 


€1ENTİTY $ SVG.feDiffuseLighting.attlist "INCLUDE" 5 
c1SSVG.feDiffuseLighting.attlist,1 
€IATTLIST S5S8VG.feDiffuseLighting.qname, 
S5SVG.Core.attrib, 
S5SVG.Style.attrib, 
S58VG.Presentation.attrib, 
SSVG.FilterPrimitiveMithln.attrib, 
surfaceScale s:Number .datatype, £TMPLTED 
diffuseConstant ":Number.datatype, 2"TMPLIED 
kernelUnitLength ":NumberOptionalNumber .datatype, £TMPLTED 
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z 
c1-- end of SVG.feDiffuseLighting.attlist --s115 


c1-- feDisplacementMap: Filter Effect Displacement Map Element --x 
€IENTİTY 55 SVG.feDisplacementMap.extra. content "" s 


€lENTİTY 55 SVG.feDisplacementMap.element "INCLUDE" x 
cl 15558VG. feDisplacementMap. element, 1 
€IENTİTY 55 SVG.feDisplacementMap.content 
"( S5SVG.animate .qname, 1 5S5SVG.set.qname, 
55S8VG. feDisplacementMap.extra.content, )“" 





z 
€ ELEMENT 5:SVG. feDisplacementMap .qname, 5:5VG. feDisplacementMap. content, x 
c1-- end of SVG.feDisplacementMap .element --x115 


€lENTİTY $ SVG.feDisplacementMap.attlist "INCLUDE" x 
cl 158VG. feDisplacementMap.attlist,1 
€ ATTLIST 5:SVG. feDisplacementMap .qname , 
S5SVG.Core.attrib, 
S5SVG.Style.attrib, 
S58VG.Presentation.attrib, 
SSVG.FilterPrimitiveMithln.attrib, 
in2 CDATA £REQUTRED 
scale s:Number .datatype, 25TMPLIED 
xChannelSelector (Rİ GİBİA)"A" 
yChannelSelector (Rİ GİBİA)""A" 
z 
c1-- end of SVG.feDisplacementMap.attlist --s11- 


c1-- feFlood: Filter Effect Flood Element .............. --- 
€ENTİTY 55 SVG.feFlood.extra. content "" s 


€ENTİTY 55 SVG.feFlood.element "INCLUDE" 5 
el 155SVG. feFlood. element, 1 
€ENTİTY 55 SVG.feFlood.content 
"( S5SVG.animate .qname, 1 5S5SVG.set.qname, 1 S5SVG.animateColor..qname, 
S5S8VG. feFlood.extra.content, )”" 
z 
€ ELEMENT S:SVG. feFlood..qname , S5SVG. feFlood. content, 5 
xc1-- end of SVG.feFlood.element --x115 


€IENTİTY $ SVG.feFlood.attlist "INCLUDE" x 

cl 85VG. feFlood.attlist,l 

€ 1ATTLIST S:SVG. feFlood. qname , 
S5SVG.Core.attrib, 
S58VG.Style.attrib, 
S58VG.Presentation.attrib, 
SSV6.FilterPrimitive.attrib, 

z 

c1-- end of SVG.feFlood.attlist --s11- 


c1-- feGaussianBlur: Filter Effect Gaussian Blur Element --x 
€VENTİTY 55 SVG.feGaussianBlur.extra. content "" s 


€ENTİTY 55 SVG.feGaussianBlur.element "INCLUDE" 5 
cl İ55SVG. feGaussianBlur .element, 1 
€ENTİTY 55 SVG.feGaussianBlur.content 
"( S5SVG.animate .qname, 1 S:SVG.set.qname, 
35S8VG. feGaussianBlur.extra.content, )“" 


e ELEMENT 5:SVG. feGaussianBlur .qname, “:SVG. feGaussianBlur content, x 
c1-- end of SVG.feGaussianBlur.element --s115 


€lENTİTY $ SVG.feGaussianBlur.attlist "INCLUDE" x 
cl İ55SVG. feGaussianBlur.attlist, 1 
€ ATTLIST 5:SVG. feGaussianBlur .qname , 
S5SVG.Core.attrib, 
S5SVG.Style.attrib, 
S58VG.Presentation.attrib, 
SSVG.FilterPrimitiveMithln.attrib, 
stdDeviation 5:NumberOptionalNumber .datatype, ““TMPLIED 
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- 
c1-- end of SVG.TfeGaussianBlur.attlist --s115 


c1-- felmage: Filter Effect Image Element .............. 5 
€IENTİTY 5. SVG.felmage.extra.content "" s 


€IENTİTY 55 SVG.felmage.element "INCLUDE" 5 
cl (555VG. felmage element, 1 
€IENTİTY $ SVG.felmage.content 
"( S5SVG.animate .qname, 1 5:SVG.set.qname, 1 S55VG.animateTransform.qname 
358VG.Tfe1mage.extra.content, )”" 
z 
€ ELEMENT 5:SVG. felmage .qname, 555VG. felmage . content, x 
c1-- end of SVG.felmage.element --x115 





€lENTİTY $ SVG.felmage.attlist "INCLUDE" 5 

c118SVG.felmage.attlist,1 

€ 1ATTLIST 5:SVG. felmage . qname 
S58VG.Core.attrib, 
S58VG.Style.attrib, 
S58VG.Presentation.attrib, 
SSVG.FilterPrimitive.attrib, 
S5SVG.XLinkEmbed.attrib, 
S5SVG.External.attrib, 
preserveAspectRatio 5:PreserveAspectRatioSpec.datatype, "xMidYMid meet" 

z 

c1-- end of SVG.felmage.attlist --s115 


c1-- feMerge: Filter Effect Merge Element .............. --- 
€ VENTİTY 5 SVG. feMerge.extra. content "" s 


€ VENTİTY 5. SVG. feMerge.element "INCLUDE" 5 
cl 1955VG. feMerge element, İ 
€ VENTİTY 5 SVG. feMerge. content 
"( S5SVG. feMergeNode .qname, 5“:SVG. feMerge.extra.content, )”" 
.. 
c ELEMENT 5:SVG. feMerge . qname , 5:5VG. feMerge. content, x 
c1-- end of SVG.feMerge.element --x115 


€IENTİTY $ SVG.feMerge.attlist "INCLUDE" 5 

cl 1555VG. feMerge.attlist, 1 

€ ATTLIST 5:SVG. feMerge. qname, 
S5SVG.Core.attrib, 
S5SVG.Style.attrib, 
S58VG.Presentation.attrib, 
SSVG.FilterPrimitive.attrib, 

z 

c1-- end of SVG.feMerge.attlist --s115 


c1-- feMergeNode: Filter Effect Merge Node Element ..... --- 
€ VENTİTY 5: SVG. feMergeNode .extra. content "" 5 


€ 1ENTİTY 5. SVG. feMergeNode.element "INCLUDE" 5 
cl İ55SVG. feMergeNode . element, 1 
€ VENTİTY 5: SVG. feMergeNode .content 
"( S5SVG.animate .qname, 1 “:SVG.set .qname, S:5VG. feMergeNode .extra.content, )”" 
z 
€ ELEMENT 5:SVG. feMergeNode .qname, 5:SVG. feMergeNode . content, 5 
xc1-- end of SVG. feMergeNode . element --x115 


€IENTİTY 5 SVG.TeMergeNode.attlist "INCLUDE" 5 
cl İ55SVG. feMergeNode .attlist,1 
€ ATTLIST 5:SVG. feMergeNode .qname , 
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S5SVG.Core.attrib, 
in CDATA £IMPLIED 
z 


c1-- end of SVG.feMergeNode.attlist --s11s 
c1-- feMorphology: Filter Effect Morphology Element .... --x 
€ENTİTY 55 SVG. feMorphology.extra.content "" s 


€lENTİTY 55 SVG. feMorphology.element "INCLUDE" 5 
cl 555VG. feMorpholooy . element, 1 
€1ENTİTY 55 SVG. feMorphology.content 

"( S5SVG.animate .qname, 1 S:SVG.set.qname, 

555VG. feMorphology .extra.content, )”" 

z 
ce ELEMENT 5:SVG. feMorpholooy .qname, 5“:5VG. feMorphology. content, 5 
xc1-- end of SVG.fTeMorphology .element --x115 


€lENTİTY $ SVG.feMorphology.attlist "INCLUDE" x 
cl 1955VG. feMorphology.attlist,l 
€ ATTLIST 5:SVG. feMorpholooy .qname, 
S5SVG.Core.attrib, 
S5SVG.Style.attrib, 
S58VG.Presentation.attrib, 
S5SV6.FilterPrimitivehithln.attrib, 
operator ( erode 1 dilate ) "erode" 
radius ?s:NumberOptionalNumber .datatype, £T1MPLTED 
z 
c1-- end of SVG.feMorphology.attlist --s115 


c1-- feOÜffset: Filter Effect Offset Element ............ --- 
€ENTİTY 55 SVG.feOffset.extra.content "" s 


€ENTİTY 55 SVG.feOffset.element "INCLUDE" 5 
cl İ55SVG. fe0Tfset .element, 1 
€ENTİTY 55 SVG.feO0ffset.content 

"( S5S8VG.animate .qname, 1 5:SVG.set.qname, S:5VG. fe0Tfset.extra.content, )”" 
z 
€ ELEMENT S:SVG. fe0Tfset.qname, 5:5VG. fe0ffset. content, x 
c1-- end of SVG.fe0ffset.element --s11s 


€IENTİTY $ SVG.feOffset.attlist "INCLUDE" 5 
cl İ55SVG. fe0ffset.attlist,1 
€ ATTLIST S:SVG. fe0ffset.qname, 
S5SVG.Core.attrib, 
S5SVG.Style.attrib, 
S58VG.Presentation.attrib, 
SSVG.FilterPrimitiveMithin.attrib, 
dx ssNumber..datatype, “”TMPLIED 
dy "sNumber.datatype, ““TMPLIED 








- 
c1-- end of SVG.feOffset.attlist --s11- 


c1-- feSpecularLighting: Filter Effect Specular Lighting Element --x 
€lENTİTY 55 SVG.feSpecularLighting.extra.content "" s 


€1ENTİTY 55 SVG.feSpecularLighting.element "INCLUDE" 5 
cl İfS5SVG. feSpecularLighting.element, 1 
€lENTİTY $ SVG.feSpecularLighting.content 
"(( SSVG.feDistantLight.qname, 1 S:8VG.fePointLight.qname, 

1 “5SVG.feSpotLight.qname, ), ( S55VG.animate .qname, 1 S5SVG. set .qname 

1 “5SVG.animateColor .qname, 5:5VG.TeSpecularLighting.extra.content, )”)" 
z 
ec ELEMENT 5:SVG. feSpecularLighting.qname, S:5VG.feSpecularLighting.content, x 
c1-- end of SVG.feSpecularLighting.element --x115 


€IENTİTY $ SVG.feSpecularLighting.attlist "INCLUDE" 5 
cl İSSVG.feSpecularLighting.attlist,1 
€ ATTLIST 5:SVG. feSpecularLighting .qname, 
S5SVG.Core.attrib, 
S5SVG.Style.attrib, 
S58VG.Presentation.attrib, 
SSVG.FilterPrimitiveMithln.attrib, 
surfaceScale s:Number .datatype, £T1MPLTED 
specularConstant s5:Number .datatype, 2”TMPLIED 


specularExponent s:Number..datatype, “”TMPLTED 
kernelUnitLength 5:NumberOptionalNumber .datatype, £TMPLTED 
z 


c1-- end of SVG.feSpecularLighting.attlist --s11s 
c1-- feTile: Filter Effect Tile Element ................ --- 


€lENTİTY 5 SVG.feTile.extra. content "" s 
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€lENTİTY $ SVG.feTile.element "INCLUDE" x 
cl 155SVG. feTile element, 1 
€lENTİTY $ SVG.feTile.content 
"( S5SVG.animate .qname, 1 55:SVG.set.qname, Ss5VG.feTile.extra.content, )”" 
z 
€ ELEMENT 5:SVG. feTile.qname, “:SVG.feTile.content, 5 
c1-- end of SVG.feTile.element --s11- 


€lENTİTY $ SVG.feTile.attlist "INCLUDE" x 

c1İ8SVG.feTile.attlist,1 

€ IATTLIST S:SVG.feTile.qname, 
S58VG.Core.attrib, 
S58VG.Style.attrib, 
958VG.Presentation.attrib, 
SSV6.FilterPrimitivelithln.attrib, 





z 
c1-- end of SVG.feTile.attlist --s115 


c1-- feTurbulence: Filter Effect Turbulence Element .... --x 
€ENTİTY 55 SVG. feTurbulence extra. content "" s 


€ENTİTY 55 SVG. feTurbulence element "INCLUDE" x 
cl İ55SVG. feTurbulence . element, 1 
€VENTİTY 55 SVG. feTurbulence. content 

"( S5SVG.animate .qname, 1 S:SVG.set.qname, 

55SVG. feTurbulence .extra.content, )”" 

z 
€ ELEMENT S:SVG. feTurbulence .qname , S:SVG. feTurbulence. content, 5 
xc1-- end of SVG.feTurbulence element --x115 


€lENTİTY $ SVG.feTurbulence.attlist "INCLUDE" 5 
cl İ555VG. feTurbulence.attlist,l 
€ ATTLIST S:SVG. feTurbulence . qname , 
S5SVG.Core.attrib, 
S58VG.Style.attrib, 
S58VG.Presentation.attrib, 
SSVG.FilterPrimitive.attrib, 
baseFrequency ?sNumberOptionalNumber .datatype, £TMPLTED 
numüctaves S$s1nteger.datatype, £1MPLIED 
seed s:Number .datatype, 2£1MPLTED 
stitchTiles ( stitch 1 noStitch ) "noStitch" 
type ( fractalNoise I turbulence ) "turbulence" 
z 
c1-- end of SVG.feTurbulence.attlist --s115 


c1-- feDistantLight: Filter Effect Distant Light Element --x 
€IENTİTY $ SVG.feDistantLight.extra.content "" s 


€IENTİTY $ SVG.feDistantLight.element "INCLUDE" 5 
c1185SVG.feDistantLight element, 1 
€lENTİTY $ SVG.feDistantLight.content 
"( S5SVG.animate .qname, 1 S:SVG.set.qname, 

555VG.feDistantLight.extra.content, )”" 
z 
€ ELEMENT 5:8VG.feDistantLight.qname, “:5VG.feDistantLight.content, x 
c1-- end of SVG.feDistantLight.element --s115 


€IENTİTY $ SVG.feDistantLight.attlist "INCLUDE" x 
c11855SVG.feDistantLight.attlist,1 
€ IATTLIST S:SVG.feDistantLight .qname, 
S5SVG.Core.attrib, 
azimuth ss:Number .datatype, “”TMPLIED 
elevation sS:Number .datatype, “2TMPLIED 
z 
c1-- end of SVG.feDistantLight.attlist --s115 


c1-- fePointLight: Filter Effect Point Light Element ... --s 
€IENTİTY $ SVG.fePointLight.extra.content "" 5 


€1ENTİTY $ SVG.fePointLight.element "INCLUDE" x 
c118SVG.fePointLight.element, 1 
€1ENTİTY $ SVG.fePointLight.content 
"( S5SVG.animate .qname, 1 S:SVG.set.qname, 
555VG.fePointLight.extra.content, )“" 
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z 
€ ELEMENT 55S8VG.fePointLight.qname, 5:SVG.fePointLight.content, 5 
c1-- end of SVG.fePointLight.element --s115 


€lENTİTY $ SVG.fePointLight.attlist "INCLUDE" x 
c118SVG.fePointLight.attlist,1 
€1ATTLIST 558VG.fePointLight.qname, 
S5SVG.Core.attrib, 
x s5Number .datatype, £TMPLTED 
y “Number .datatype, £1MPLTED 
z s5:Number..datatype, “2”TMPLIED 
z 
c1-- end of SVG.fePointLight.attlist --s11- 


c1-- feSpotLight: Filter Effect Spot Light Element ..... -- 





€IENTİTY 5. SVG.feSpotLight.extra.content "" 5 


€1ENTİTY $ SVG.feSpotLight.element "INCLUDE" 5 
cl (58VG. feSpotLight.element, 1 
€1ENTİTY $ SVG.feSpotLight.content 
"( S5SVG.animate .qname, 1 55SVG.set.qname, S55VG.feSpotLight.extra.content, )”" 
z 
€ ELEMENT 5:SVG. feSpotLight .qname, 5:5VG.feSpotLight.content, x 
c1-- end of SVG.feSpotLight.element --x115 


€IENTİTY $ SVG.feSpotLight.attlist "INCLUDE" 5 
cl S5VG.feSpotLight.attlist,1 
€ ATTLIST 5:SVG. feSpotLight .qname 
S5SVG.Core.attrib, 
x s5Number .datatype, £1MPLTED 
y “s5Number .datatype, £1MPLTED 
z s5Number .datatype, “25TIMPLIED 
pointsAtX s:Number.datatype, “£IMPLIED 
pointsAtY s:Number.datatype, £IMPLIED 
pointsAtZ ?:Number.datatype, £IMPLIED 
specularExponent s:Number..datatype, “”TMPLTED 
limitingConeAngle ?sNumber .datatype, £IMPLIED 
z 
c1-- end of SVG.feSpotLight.attlist --c11- 


c1-- feFuncR: Filter Effect Function Red Element ....... --- 
€IENTİTY 55 SVG.feFuncR.extra.content "" s 


€ENTİTY 55 SVG. feFuncR.element "INCLUDE" 5 
cl 1555VG. feFuncR. element, 1 
€IENTİTY 55 SVG.feFuncR. content 
"( S5SVG.animate .qname, 1 S:SVG.set.qname, “:SVG. feFuncR.extra.content, )”" 
z 
€ ELEMENT S:SVG. feFuncR. qname , S:SVG. feFuncR. content, x 
c1-- end of SVG. feFuncR.element --x11- 


€lENTİTY $ SVG.feFuncR.attlist "INCLUDE" x 

cl 1555VG. feFuncR.attlist,l 

€ ATTLIST 5S:SVG. feFuncR. qname , 
S58VG.Core.attrib, 
type ( identity 1 table I discrete 1 linear İl gamma ) £REQUTRED 
tableValues CDATA £1MPLTED 
slope S:Number .datatype, 2£?TMPLTED 
intercept "Number ..datatype, “"TMPLIED 
amplitude s:Number .datatype, “2TMPLIED 
exponent SsNumber .datatype, £T1MPLIED 
offset ssNumber .datatype, £1MPLTED 

z 

c1-- end of SVG.feFuncR.attlist --s11- 


c1-- feFuncG: Filter Effect Function Green Element ..... --- 


€lENTİTY 55 SVG.feFuncG.extra. content "" s 


€ENTİTY 55 SVG.feFuncG.element "INCLUDE" 5 
cl 155SVG. feFuncG. element, 1 
€VENTİTY 55 SVG.feFuncG. content 
"( S5SVG.animate .qname, 1 5S5SVG.set.qname, “:SVG. feFuncG.extra.content, )”" 
z 
€ ELEMENT S:SVG. feFuncG. qname , S:SVG. feFuncG. content, 5 
xc1-- end of SVG.feFuncG.element --x11- 
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€lENTİTY $ SVG.feFuncG.attlist "INCLUDE" x 

cl 1555VG. feFuncG.attlist,1 

€ ATTLIST S:SVG. feFuncG. qname , 
S5SVG.Core.attrib, 
type ( identity 1 table Il discrete 1 linear İl gamma ) £REQUTRED 
tableValues CDATA £1MPLTED 
slope s:Number..datatype, “FTMPLIED 
intercept "Number ..datatype, “"TMPLIED 
amplitude s:Number .datatype, “2TMPLIED 
exponent 5sNumber .datatype, “£1MPLIED 
offset ssNumber .datatype, £1MPLTED 

z 

c1-- end of SVG.feFuncG.attlist --s11- 





c1-- feFuncB: Filter Effect Function Blue Element ...... -- 
€lENTİTY 55 SVG.feFuncB.extra.content "" s 


€ENTİTY 55 SVG.feFuncB.element "İNCLUDE" 5 
cl 1555VG. feFuncB. element, 1 
€lENTİTY 55 SVG.feFuncB. content 
"( S5SVG.animate .qname, 1 S5SVG.set.qname, S:SVG. feFuncB.extra.content, )”" 
z 
€ ELEMENT S:SVG. feFuncB. qname , S:SVG. feFuncB. content, x 
c1-- end of SVG. feFuncB.element --x11- 


€lENTİTY $ SVG.feFuncB.attlist "INCLUDE" x 

cl 1555VG. feFuncB.attlist,l 

€ ATTLIST S“SVG. feFuncB. qname , 
S5SVG.Core.attrib, 
type ( identity 1 table I discrete 1 linear İl gamma ) £REQUTRED 
tableValues CDATA £1MPLTED 
slope s:Number..datatype, “”TMPLIED 
intercept "Number .datatype, “"TMPLIED 
amplitude s:Number .datatype, “2TMPLIED 
exponent SsNumber .datatype, £1MPLIED 
offset s5Number .datatype, £1MPLTED 

- 

c1-- end of SVG.feFuncB.attlist --s11- 


c1-- feFuncA: Filter Effect Function Alpha Element ..... --- 
€lENTİTY 55 SVG.feFuncA.extra.content "" s 


€ENTİTY 55 SVG. feFuncA.element "INCLUDE" x 
cl İ55SVG. feFuncA. element, 1 
€1ENTİTY 55 SVG.feFuncA. content 
"( S5SVG.animate .qname, 1 S:SVG.set.qname, S:5VG. feFuncA.extra.content, )”" 
z 
€ ELEMENT S:SVG. feFuncA. qname , S:SVG. feFuncA. content, x 
c1-- end of SVG. feFuncA.element --x115 


€IENTİTY $ SVG.feFuncA.attlist "INCLUDE" 5 

cl 1555VG. feFuncA.attlist,l 

€ ATTLIST 5S:SVG. feFuncA. qname , 
S5SVG.Core.attrib, 
type ( identity 1 table I discrete 1 linear l gamma ) £REQUTRED 
tableValues CDATA £1MPLTED 
slope s:Number..datatype, “”TMPLİED 
intercept "Number .datatype, “"TMPLIED 
amplitude s:Number .datatype, 2 TMPLIED 
exponent ssNumber .datatype, £1MPLIED 
offset s5Number .datatype, £T1MPLTED 

z 

c1-- end of SVG.feFuncA.attlist --s11- 


c1-- end of svg-filter.mod --x 


A.3.33 Basic Filter Module 
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The Basic Filter Module defines the Filter.class and FilterPrimitive.class element collections and the Filter.attrib, 
FilterColor.attrib, FilterPrimitive.attrib and FilterPrimitiveVVithln.attrib attribute collections. 





2000777” ”” --- 
e€1-- SVG 1.1 Basic Filter MöduLe: ........Uü üə oy azə saa ƏR OR Ra k3 a bə sşəeii --- 
c1-- file: svg-basic-filter.mod 


This is SVG, a language for describing tuo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), All Rights Reserved. 
Revision: $I1d: svg-basic-filter.mod,v 1.5 2011/07/08 03:18:58 cmccorma Exp $ 


This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//M3C//ELEMENTS SVG 1.1 Basic Filter//EN" 
SYSTEM "http: / /vvv/.vV3.org/Graphics/SVG/1.1/DTD/svg-basic-filter.mod" 


c1-- Basic Filter 


filter, feBlend, feColorMatrix, feComponentTransfer, feComposite, 
feFlood, feGaussianBlur, felmage, feMerge, feMergeNode, fe0ffset, 
feTile, feFuncR, feFuncG, feFuncB, feFuncA 


This module declares markup to provide support for filter effect. 
--- 


c1-- "filter" property/attribute value (e.g., "none", curis) --s 
€lENTİTY $ FilterValue.datatype "CDATA" x 


c€1-- list of -number”ss, but at least one and at most tvo --x 
€VENTİTY 5 NumberOptionalNumber .datatype "CDATA" 5 


c1-- Qualified Names (Default) ......................... --- 


€lENTİTY 
€IENTİTY 
€IENTİTY 
€IENTİTY 
€lENTİTY 
€lENTİTY 
€IENTİTY 


SVG.filter.qname "filter" x 

SVG. feBlend.qname "feBlend" 5 

SVG.feColorMatrix.qname "feColorMatrix" x 

SVG. feComponentTransfer.qname "feComponentTransfer" x 
SVG. feComposite.qname "feComposite" x 

SVG. feFlood.qname "feFlood" 5 
SVG.feGaussianBlur.qname "feGaussianBlur" x 


9? 99 0? o? o? o? op 
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€lENTİTY 55 SVG.felmage.qname "felmage" 5 

€ VENTİTY 5. SVG. feMerge.qname "fTeMerge" 5 

€ VENTİTY 5: SVG. feMergeNode .qname "TeMergeNode" 5 
€ENTİTY 55 SVG.feO0ffset.qname "fTe0ffset" s 
€IENTİTY 55 SVG.feTile.qname "feTile" 5 
€1ENTİTY 55 SVG.feFuncR.qname "feFuncR" 5 
€ENTİTY 55 SVG.feFuncG.qname "feFuncG" 5 
€1ENTİTY 55 SVG. feFuncB.qname "feFuncB" 5 

€ ENTİTY 55 SVG. feFuncA. qname "feFuncA" 5 
c1-- Attribute Collections (Default) ................... --- 
€IENTİTY 55 SVG.Core.attrib "" s 

€lENTİTY $ SVG.Container.attrib "" s 
€lENTİTY $ SVG.Style.attrib "" s 

€IENTİTY $ SVG.Vievport.attrib "" 
€IENTİTY $ SVG.Text.attrib "" s 

€IENTİTY $ SVG.TextContent.attrib "" s 
€IENTİTY $ SVG.Font.attrib "" s 

€lENTİTY $ SVG.Paint.attrib "" s 

€ENTİTY 55 SVG.Color.attrib "" s 

€IENTİTY $ SVG.Üpacity.attrib "" s 
€IENTİTY 5 SVG.Graphics.attrib "" 
€VENTİTY 55 SVG.Marker.attrib "" s 
€IENTİTY $ SVG.ColorProfile.attrib "" s 
€IENTİTY $ SVG.Gradient.attrib "" 
€IENTİTY $ SVG.Clip.attrib "" s 

€IENTİTY 55 SVG.Mask.attrib "" s 

€lENTİTY 55 SVG.Cursor.attrib "" s 
€lENTİTY $ SVG.XLink.attrib "" s 

€IENTITY $ SVG.XLinkEmbed.attrib "" s 
€IENTİTY 5 SVG.External.attrib "" 

seı-z- SVo:Filterielass sçcsəyaə əə yaşa Ra apa sapaə -- 


€IENTİTY $ SVG.Filter.extra.class "" s 


€IENTİTY $ SVG.Filter.class 
"1 SSVG.filter.qname, S5SVG.Filter.extra.class," 
z 


€1-- SVG.FilterPrimitive.class ......................... --- 
€lENTİTY $ SVG.FilterPrimitive.extra.class "" s 


€lENTİTY $ SVG.FilterPrimitive.class 
"1 S5SVG. feBlend.qname, 1 5:SVG. feColorMatrix.qname , 
İ “5SVG. feComponentTransfer.qname, 1 5:SVG. feComposite .qname, 
İ “5SVG. feFlood.qname, 1 S5SVG. feGaussianBlur ..qname, 1 55SVG. felmage .qname, 
İ “5SVG. feMerge.qname, 1 S:SVG. fe0Tfset.qname, 1 S5SVG.TfeTile.qname, 
35SV6G.FilterPrimitive.extra.class," 
z 


sız SVo:FiUten.attrib. s u9uu yaa s xsus --- 

€IENTİTY $ SVG.Filter.extra.attrib "" s 

€lENTİTY $ SVG.Filter.attrib 
"filter sFilterValue.datatype, £1MPLIED 
35VG.Filter.extra.attrib," 

z 

e1-- SVG.FilterColor.attrib ............................ --- 

€lENTİTY $ SVG.FilterColor.extra.attrib "" s 

€lENTİTY $ SVG.FilterColor.attrib 
"color-interpolation-filters ( auto /I sRGB / linearRGB 1 inherit ) 

Y£IMPLIED 

358VG.FilterColor.extra.attrib," 

z 

c1-- SVG.FilterPrimitive.attrib ........................ --- 


€IENTİTY $ SVG.FilterPrimitive.extra.attrib "" s 


€IENTİTY $ SVG.FilterPrimitive.attrib 
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"x ssCoordinate.datatype, £1MPLTED 

y “:Coordinate.datatype, “5TMPLIED 

vidth "sLength.datatype, £1MPLTED 

height s:Length.datatype, £1MPLIED 

result CDATA £IMPLIED 

358V6G.FilterPrimitive.extra.attrib," 
z 


c1-- SVG.FilterPrimitiveMithin.attrib .................. --- 
€IENTİTY $ SVG.FilterPrimitiveMNithln.extra.attrib "" 


€IENTİTY $ SVG.FilterPrimitiveMNithln.attrib 
"SSVG.FilterPrimitive.attrib, 
in CDATA £IMPLIED 
35VG.FilterPrimitiveNithin.extra.attrib," 
z 


e€1-- SVG.Presentation.attrib ........................... -- 
€IENTİTY $ SVG.Presentation.extra.attrib "" s 


€lENTİTY $ SVG.Presentation.attrib 
"SSVG.Container.attrib, 
358VG.Vievport.attrib, 
958VG.Text.attrib, 
558VG.TextContent.attrib, 
958VG.Font.attrib, 
9558VG.Paint.attrib, 
358VG.Color.attrib, 
555VG.Opacity.attrib, 
358VG.Graphics.attrib, 
558VG.Marker.attrib, 
358VG.ColorProfile.attrib, 
358VG.Gradient.attrib, 
9358V6.Clip.attrib, 
555VG.Mask.attrib, 
35VG.Filter.attrib, 
358VG.FilterColor.attrib, 
358VG.Cursor.attrib, 
T1ood-color 5sSVGColor.datatype, £T1MPLIED 
T1ood-opacity 5$s0pacityValue.datatype, £1MPLTED 
lighting-color S5SVGColor.datatype, £TMPLTED 
358VG.Presentation.extra.attrib," 

- 


e1-- filter: Filter Element ............................ --- 
€lENTİTY $ SVG.filter.extra.content "" s 


€lENTİTY $ SVG.filter.element "INCLUDE" x 
el İ85SVG.filter element, 1 

€lENTİTY $ SVG.filter.content 

"( $SVG.Description.class, S5SVG ..animate .qname, 1 S:SVG. set .qname, 
35VG.FilterPrimitive.class, SSVG.filter.extra.content, )”" 





z 
€ ELEMENT S:SVG.filter.qname, S:SVG.filter.content, x 
c1-- end of SVG.filter.element --s115 


€IENTİTY $ SVG.filter.attlist "INCLUDE" x 
e1İ8SVG.filter.attlist,1 
€ IATTLIST S:SVG.filter.qname, 
S5SVG.Core.attrib, 
S5SVG.Style.attrib, 
S58VG.Presentation.attrib, 
S5SV6.XLink.attrib, 
S5SVG.External.attrib, 
x 55Coordinate.datatype, £IMPLTIED 
y s:Coordinate.datatype, £TIMPLTED 
vidth "sLength.datatype, £1MPLTED 
height 5s:Length.datatype, £1MPLTED 
filterRes ":NumberOptionalNumber .datatype, “£TMPLTED 
filterUnits ( userSpaceOnUse 1 obfiectBoundingBox ) £TIMPLIED 
primitiveUnits ( userSpaceOnUse 1 obiectBoundingBox ) £TIMPLIED 
z 
c1-- end of SVG.filter.attlist --s11l 


c1-- feBlend: Filter Effect Blend Element .............. --- 
€ENTİTY 55 SVG. feBlend.extra content "" s 


€VENTİTY 55 SVG.feBlend.element "INCLUDE" 5 
cl İ55SVG. feBlend.element, 1 
€1ENTİTY 55 SVG.feBlend.content 
"( S5SVG.animate .qname, 1 5S:SVG.set.qname, “:SVG. feBlend.extra.content, )”" 
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z 
ce ELEMENT 55SVG. feBlend..qname, 55SVG. feBlend. content, x 
x1-- end of SVG.feBlend.element --s115 


€IENTİTY $ SVG.feBlend.attlist "INCLUDE" 5 
cl 158VG. feBlend.attlist, 1 
€ ATTLIST S:SVG. feBlend .qname , 
S58VG.Core.attrib, 
S5SVG.Style.attrib, 
S58VG.Presentation.attrib, 
SSVG.FilterPrimitiveMithin.attrib, 
in2 CDATA £REQUTRED 
mode ( normal / multiply 1 screen l darken 1 lighten ) "normal" 
- 
c1-- end of SVG.feBlend.attlist --s11- 





c1-- feColorMatrix: Filter Effect Color Matrix Element . --x 
€ENTİTY 55 SVG.feColorMatrix.extra.content "" s 


€IENTİTY 5 SVG.feColorMatrix.element "INCLUDE" x 
cl İ555VG. feColorMatrix.element, 1 
€lENTİTY $ SVG.feColorMatrix.content 
"( S5SVG.animate .qname, 1 S:SVG.set.qname, 
358VG.feColorMatrix.extra.content, )”" 
z 
€ ELEMENT S:SVG. feColorMatrix.qname, 5:SVG.feColorMatrix.content, x 
c1-- end of SVG.feColorMatrix.element --x11- 


€IENTİTY $ SVG.feColorMatrix.attlist "INCLUDE" x 
cl 8SVG.feColorMatrix.attlist,l 
€ ATTLIST S:SVG. feColorMatrix.qname , 
S5SVG.Core.attrib, 
S5SVG.Style.attrib, 
S58VG.Presentation.attrib, 
SSVG6.FilterPrimitiveMithin.attrib, 
type ( matrix İl saturate 1 hueRotate l luminanceToAlpha ) "matrix" 
values CDATA £TIMPLIED 
- 
c1-- end of SVG.feColorMatrix.attlist ---11- 


c1-- feComponentTransfer: Filter Effect Component Transfer Element --x 
€ ENTİTY 55 SVG. feComponentTransfer.extra. content "" s 


€ ENTİTY 55 SVG. feComponentTransfer.element "INCLUDE" x 
cl İ55SVG. feComponentTransfer element, 1 
€ENTİTY 55 SVG. feComponentTransfer.content 
"( S5SVG. feFuncR. name , ?, 5:SVG. feFuncG .qname  ?, S:SVG. feFuncB.. qname  ?, 
55SVG. feFuncA . qname , ? S55VG. feComponentTransfer.extra.content, )" 


z 
e ELEMENT 5:SVG. feComponentTransfer.qname, 5:5VG. feComponentTransfer.content, x 
c1-- end of SVG. feComponentTransfer.element --x115 


€IENTİTY 55 SVG.feComponentTransfer.attlist "INCLUDE" x 
el İ555VG. feComponentTransfer.attlist,1 
€ ATTLIST 5:SVG. feComponentTransfer.qname, 
S5SVG.Core.attrib, 
S5SVG.Style.attrib, 
S58VG.Presentation.attrib, 
SSVG.FilterPrimitivehithin.attrib, 
z 
c1-- end of SVG.TfeComponentTransfer.attlist --sl1- 


c1-- feComposite: Filter Effect Composite Element ...... --5 
€IENTİTY 55 SVG.feComposite.extra.content "" s 


€lENTİTY 55 SVG.feComposite.element "INCLUDE" 5 


el İ55SVG. feComposite element, 1 
€IENTİTY 55 SVG.feComposite.content 
"( S5SVG.animate .qname, 1 “:SVG.set .qname, S:5VG. feComposite.extra.content, )”" 
z 
€ ELEMENT 5:SVG. feComposite .qname, 5:5VG. feComposite. content, 5 
c1-- end of SVG. feComposite.element --s11- 


€lENTİTY $ SVG.feComposite.attlist "INCLUDE" 5 
cl 155SVG. feComposite.attlist,1 
€ ATTLIST 5:SVG. feComposite .qname , 
S58VG.Core.attrib, 
S5SVG.Style.attrib, 
S58VG.Presentation.attrib, 
SSV6.FilterPrimitivehithln.attrib, 
in2 CDATA £REQUTRED 
operator ( over l in 1 out 1 atop 1 xor 1 arithmetic ) "over" 
k1 s5Number..datatype, £TMPLTED 
k2 s5Number..datatype, £TMPLTED 
k3 s5Number..datatype, £TMPLTED 
k4 s:Number..datatype, £TMPLTED 
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.. 
c1-- end of SVG.feComposite.attlist --sl15 


c1-- feFlood: Filter Effect Flood Element .............. --- 





€ENTİTY 55 SVG.feFlood.extra. content "" s 


€ENTİTY 55 SVG.feFlood.element "INCLUDE" x 
el 155SVG. feFlood.element, 1 
€1ENTİTY 55 SVG.feFlood.content 
"( S5SVG.animate .qname, 1 S5SVG.set.qname, 1 S55VG.animateColor.. qname, 
S5S8VG. feFlood.extra.content, )”" 
z 
€ ELEMENT S“SVG. feFlood .qname , S5SVG. feFlood. content, x 
xc1-- end of SVG.feFlood.element --x11- 


€lENTİTY $ SVG.feFlood.attlist "INCLUDE" 5 
cl 85SVG. feFlood.attlist,l 
€ ATTLIST S:SVG. feFlood. qname , 
S5SVG.Core.attrib, 
S5SVG.Style.attrib, 
S58VG.Color.attrib, 
SSVG.FilterColor.attrib, 
SSVG.FilterPrimitive.attrib, 
Tlood-color ssSVGColor..datatype, “£TIMPLTED 
Tlood-opacity 5Ss0pacityValue.datatype, £T1MPLTED 
z 
c1-- end of SVG.feFlood.attlist --s11- 


c1-- feGaussianBlur: Filter Effect Gaussian Blur Element --x 
€1ENTİTY 55 SVG. feGaussianBlur.extra. content "" s 


€lENTİTY 55 SVG.feGaussianBlur.element "INCLUDE" 5 
el İ55SVG. feGaussianBlur .element, 1 
€ENTİTY 55 SVG.feGaussianBlur.content 
"( S5SVG.animate .qname, 1 5S:SVG.set.qname, 
35S8VG. feGaussianBlur.extra.content, )“" 


z 
€ ELEMENT 5:SVG. feGaussianBlur .qname, S5:SVG. feGaussianBlur content, x 
c1-- end of SVG. feGaussianBlur element --s115 


€IENTİTY $ SVG.feGaussianBlur.attlist "INCLUDE" 5 
cl İ555VG. feGaussianBlur.attlist,1 
€ ATTLIST S:SVG. feGaussianBlur.qname, 
S58VG.Core.attrib, 
SSVG.FilterColor.attrib, 
SSVG6.FilterPrimitivehithin.attrib, 
stdDeviation 5:NumberOptionalNumber .datatype, ““TMPLIED 





- 
c1-- end of SVG.feGaussianBlur.attlist --s115 


c1-- felmage: Filter Effect Image Element .............. 5 





€IENTİTY 55 SVG.Tfelmage.extra.content "" s 


€IENTİTY $ SVG.felmage.element "INCLUDE" 5 


cl 155SVG. felmage element, 1 
€1ENTİTY $ SVG.felmage.content 
"( S5SVG.animate .qname, 1 5:SVG.set.qname, 1 S55VG.animateTransform.qname 
558VG.Tfelmage.extra.content, )”" 
.. 
€ ELEMENT 5:SVG. felmage . qname, 555SVG. felmage. content, x 
c1-- end of SVG.felmage.element --x115 
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€lENTİTY $ SVG.felmage.attlist "INCLUDE" 5 

c185SVG.felmage.attlist,1 

€ IATTLIST 5:SVG. felmage. qname, 
S5SVG.Core.attrib, 
S5SVG.Style.attrib, 
S58VG.Presentation.attrib, 
SSVG.FilterPrimitive.attrib, 
S5SVG.XLinkEmbed.attrib, 
S5SVG.External.attrib, 
preserveAspectRatio 5:PreserveAspectRatioSpec.datatype, "xMidYMid meet" 

z 

c1-- end of SVG.felmage.attlist --s115 


c1-- feMerge: Filter Effect Merge Element .............. -- 





€ VENTİTY 5 SVG. feMerge.extra.content "" s 


€ VENTİTY 5. SVG. feMerge.element "INCLUDE" 5 
cl İ55SVG. feMerge . element, 1 
€ VENTİTY 5 SVG. feMerge. content 
"( S5SVG. feMergeNode .qname, “:SVG. feMerge.extra.content, )”" 
z 
c ELEMENT 5:SVG. feMerge . qname, 5:SVG. feMerge. content, x 
c1-- end of SVG.feMerge.element --x115 


€lENTİTY $ SVG.feMerge.attlist "INCLUDE" x 

cl İ55SVG. feMerge.attlist,l 

€ ATTLIST 5:SVG. feMerge. qname, 
S5SVG.Core.attrib, 
SSV6G.FilterColor.attrib, 
SSVG.FilterPrimitive.attrib, 

z 

c1-- end of SVG.feMerge.attlist --s115 


c1-- feMergeNode: Filter Effect Merge Node Element ..... --- 
€ VENTİTY 5: SVG. feMergeNode .extra. content "" 5 


€ VENTİTY 5 SVG. feMergeNode.element "INCLUDE" 5 
cl İ55SVG. feMergeNode . element” 1 
€ VENTİTY 5 SVG. feMergeNode .content 
"( S5SVG.animate .qname, 1 S:SVG.set .qname, “:5VG. feMergeNode.extra.content, )”" 
z 
€ ELEMENT 5:SVG. feMergeNode .qname, 5:5VG. TfeMergeNode . content, 5 
x1-- end of SVG. feMergeNode element --z115 


€1ENTİTY $ SVG.TeMergeNode.attlist "INCLUDE" 5 
cl İ55SVG. feMergeNode .attlist,1 
€ ATTLIST 5:SVG. feMergeNode .qname , 
S5SVG.Core.attrib, 
in CDATA £FIMPLIED 
z 
c1-- end of SVG.feMergeNode.attlist --c115 


c1-- fetÜffset: Filter Effect Offset Element ............ --- 
€1ENTİTY 55 SVG.feO0ffset.extra.content "" s 


€ENTİTY 55 SVG.feOffset.element "INCLUDE" 5 
cl İ55SVG. fe0fTfset .element, 1 
€IENTİTY 55 SVG.feO0ffset.content 

"( S5SVG.animate .qname, 1 55SVG.set .qname, S:5VG. fe0Tfset.extra.content, )”" 
z 
€ ELEMENT S:SVG. fe0Tfset.qname, 3:5VG. fe0ffset. content, x 
x1-- end of SVG.feO0ffset.element --s11- 


€lENTİTY $ SVG.feOffset.attlist "INCLUDE" 5 
cl İ55SVG. fe0ffset.attlist,1 
€ ATTLIST S:SVG. fe0ffset.qname, 








S5SVG.Core.attrib, 
SSVG.FilterColor.attrib, 
SSVG.FilterPrimitivehithln.attrib, 
dx ssNumber..datatype, ““TMPLIED 
dy "sNumber.datatype, “”TMPLIED 

- 

c1-- end of SVG.feOffset.attlist --sl1s 
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c1-- feTile: Filter Effect Tile Element ................ --- 
€IENTİTY 5 SVG.feTile.extra. content "" s 


€lENTİTY $ SVG.feTile.element "INCLUDE" x 
cl 155SVG. feTile element, 1 
€IENTİTY $ SVG.feTile.content 
"( S5SVG.animate .qname, 1 5:SVG.set.qname, S55VG.feTile.extra.content, )“" 
z 
€ ELEMENT 5:SVG. feTile .qname, “:5VG.feTile.content, x 
c1-- end of SVG.TeTile.element --s115 


€lENTİTY $ SVG.feTile.attlist "INCLUDE" x 

c1İ8SVG.feTile.attlist,1 

€ IATTLIST S:SVG.feTile.qname, 
S5SVG.Core.attrib, 
SSVG.FilterColor.attrib, 
SSVG6.FilterPrimitiveMithin.attrib, 





z 
c1-- end of SVG.feTile.attlist --s115 


c1-- feFuncR: Filter Effect Function Red Element ....... --- 
€lENTİTY 55 SVG.feFuncR.extra content "" s 


€ENTİTY 55 SVG.feFuncR.element "IİNCLUDE" 5 
cl 155SVG. feFuncR. element, 1 
€ENTİTY 55 SVG.feFuncR. content 
"( S5SVG.animate .qname, 1 S:SVG.set.qname, “:5VG. feFuncR.extra.content, )”" 
- 
€ ELEMENT S:SVG. feFuncR. qname , S:SVG. feFuncR. content, x 
c1-- end of SVG. feFuncR.element --x11- 


€IENTİTY $ SVG.feFuncR.attlist "INCLUDE" x 

cl 155SVG. feFuncR.attlist,l 

€ ATTLIST 5S:SVG. feFuncR. qname , 
S5SVG.Core.attrib, 
type ( identity l table I discrete Il linear İl gamma ) “£/REQUTRED 
tableValues CDATA £1MPLTED 
slope s:Number..datatype, “TMPLIED 
intercept "Number .datatype, “"IMPLIED 
amplitude s:Number .datatype, “2£TMPLIED 
exponent ssNumber .datatype, £1MPLIED 
offset s5Number .datatype, £1MPLTED 

.. 

c1-- end of SVG.feFuncR.attlist --s11- 


c1-- feFuncG: Filter Effect Function Green Element ..... --- 
€ENTİTY 55 SVG.feFuncG.extra. content "" s 


€ENTİTY 55 SVG.feFuncG.element "INCLUDE" 5 
cl İ55SVG. feFuncG. element, 1 
€1ENTİTY 55 SVG.feFuncG. content 
"( S5SVG.animate .qname, 1 S:SVG.set.qname, S:SVG. feFuncG.extra.content, )”" 
z 
€ ELEMENT S:SVG. feFuncG. qname , S:SVG. feFuncG. content, x 
c1-- end of SVG. feFuncG.element --x11- 


€IENTİTY $ SVG.feFuncG.attlist "INCLUDE" 5 
cl 1555VG. feFuncG.attlist,l 
€ ATTLIST 5S:SVG. feFuncG. qname , 
S5SVG.Core.attrib, 
type ( identity l table 1 discrete Il linear İl gamma ) 2£REQUTRED 
tableValues CDATA £1MPLTED 
slope ":Number.datatype, “”TMPLİED 
intercept "Number .datatype, “"TMPLIED 
amplitude s:Number .datatype, 2TMPLIED 
exponent ssNumber .datatype, £1MPLIED 


offset ssNumber .datatype, £1MPLTED 
z 
xc1-- end of SVG.TfeFuncG.attlist --s115 
c1-- feFuncB: Filter Effect Function Blue Element ...... --- 


€1ENTİTY 55 SVG.feFuncB.extra. content "" s 
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€ENTİTY 55 SVG.feFuncB.element "INCLUDE" 5 
cl İ55SVG. feFuncB. element, 1 
€1ENTİTY 55 SVG.feFuncB. content 
"( S5SVG.animate .qname, 1 S:SVG.set.qname, S:SVG. feFuncB.extra.content, )”" 
z 
€ ELEMENT S:SVG. feFuncB. qname , S5SVG. feFuncB. content, x 
c1-- end of SVG. feFuncB.element --x11- 


€IENTİTY $ SVG.feFuncB.attlist "INCLUDE" 5 

cl 1555VG. feFuncB.attlist,l 

€ ATTLIST S:SVG. feFuncB. qname , 
S5SVG.Core.attrib, 
type ( identity 1 table I discrete 1 linear İl gamma ) “£REQUTRED 
tableValues CDATA £1MPLTED 
slope s:Number..datatype, “FTMPLIED 
intercept "Number .datatype, “"TMPLIED 
amplitude s:Number .datatype, “2TMPLIED 
exponent ssNumber .datatype, £1MPLIED 
offset ssNumber .datatype, £1MPLTED 





z 
xc1-- end of SVG.TfeFuncB.attlist --s11- 


c1-- feFuncA: Filter Effect Function Alpha Element ..... --- 
€ENTİTY 55 SVG.feFuncA.extra content "" s 


€ENTİTY 55 SVG. feFuncA.element "INCLUDE" 5 
cl İ55SVG. feFuncA. element, 1 
€1ENTİTY 55 SVG.feFuncA. content 
"( S5SVG.animate .qname, 1 S:SVG.set.qname, “:5VG. feFuncA.extra.content, )”" 
z 
€ ELEMENT S:SVG. feFuncA. qname , S:SVG. feFuncA. content, x 
c1-- end of SVG. feFuncA.element --x11- 


€lENTİTY $ SVG.feFuncA.attlist "INCLUDE" 5 

cl 1555VG. feFuncA.attlist,l 

€ ATTLIST S:SVG. feFuncA. qname , 
S58VG.Core.attrib, 
type ( identity 1 table I discrete 1 linear l gamma ) £REQUTRED 
tableValues CDATA £1MPLTED 
slope s:Number..datatype, “FTMPLTIED 
intercept "Number .datatype, “"TMPLIED 
amplitude s:Number .datatype, 2TMPLIED 
exponent SsNumber .datatype, “£T1MPLIED 
offset ss:Number .datatype, £1MPLTED 

- 

c1-- end of SVG.feFuncA.attlist --s11- 


c1-- end of svg-basic-filter.mod --5 


A.3.34 Cursor Module 


The Cursor Module defines the Cursor.class element collection and the Cursor.attrib attribute collection. 


Elements in collection 


cursor 





Collection name İ Elements in collection 





Cursor.attrib cursor 


S 0 İR İİ 0 
s€1-- SVG 1.1 Cursor Module 
c1-- file: svg-cursor.mod 
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This is SVG, a language for describing tvo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), ALL Rights Reserved. 
Revision: $I1d: svg-cursor.mod,v 1.2 2011/07/08 03:18:58 cmccorma Exp $ 
This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//3C/ /ELEMENTS SVG 1.1 Cursor//EN" 
SYSTEM "http: / /vvv/..vV3.org/Graphics/SVG/1.1/DTD/svg-cursor.mod" 


c1-- Cursor 





cursor 


This module declares markup to provide support for cursor. 
-- 


c1-- "cursor" property/attribute value (e.g., "crosshair", curis) --s 
€lENTİTY 55 CursorValue.datatype "CDATA" 5 


c1-- Qualified Names (Default) ......................... --5 
€lENTİTY 55 SVG.cursor.qname "cursor" s 

c1-- Attribute Collections (Default) ................... 2-5 
€lENTİTY 
€lENTİTY 


€IENTİTY 
€IENTİTY 


95 SVG.Core.attrib "" s 

95 SVG.Conditional.attrib "" s 
955 SVG.XLinkRequired.attrib "" s 
955 SVG.External.attrib "" s 


sll- s “5VESCursoryelass”o ııı s esə sa po odu B --- 





€lENTİTY 55 SVG.Cursor.extra.class "" s 


€ENTİTY 55 SVG.Cursor.class 
"1 S5SVG.cursor.qname, S5SVG.Cursor.extra.class, " 
z 


el “SVözCursor-attrib: / səsə əsə saa Dala Ra Rod üb 5 
€IENTİTY $ SVG.Cursor.extra.attrib "" 
€lENTİTY $ SVG.Cursor.attrib 

"cursor s:CursorValue .datatype, £1MPLIED 


358VG.Cursor.extra.attrib," 
z 


e1-- cursor: Cürsor Element ............................ 2-5 
€lENTİTY 55 SVG.cursor.extra. content "" s 

€lENTİTY 55 SVG.cursor.element "İNCLUDE" x 

el İS5SVG. cursor. element, 1 


€lENTİTY 55 SVG.cursor.content 
"( $SVG.Description.class, S:SVG.cursor.extra.content, )“" 


z 
€ ELEMENT S:SVG. cursor ..qname, S5SVG. cursor. content, s 
xc1-- end of SVG.cursor.element --s115 


€lENTİTY $ SVG.cursor.attlist "INCLUDE" x 

el İSSVG. cursor.attlist,1 

€ ATTLIST S5SVG. cursor .qname, 
S5SVG.Core.attrib, 
S5V6G.Conditional.attrib, 
s5SV6.XLinkRequired.attrib, 
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S5SVG.External.attrib, 

x 55Coordinate.datatype, £IMPLTIED 

y 5:Coordinate.datatype, £IMPLTED 
z 


c1-- end of SVG.cursor.attlist --s115 


c1-- end of svg-cursor.mod --5 


A.3.35 Hyperlinking Module 


The Hyperlinking Module defines the Hyperlink.class element collection. 


Collection name İ Elements in collection 





c1-- file: svg-hyperlink.mod 
This is SVG, a language for describing tvo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), ALL Rights Reserved. 
Revision: $1d: svg-hyperlink.mod,v 1.3 2011/07/08 03:18:59 cmccorma Exp $ 
This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//3C//ELEMENTS SVG 1.1 Hyperlinking//EN" 
SYSTEM "http: / /uvv .vV3.org/Graphics/SVG/1.1/DTD/svg-hyperlink.mod" 


c1-- Hyperlinking 
a 


This module declares markup to provide support for hyper linking. 
--- 


c€1-- link to this target --s 
€IENTİTY $ LinkTarget.datatype "NMTOKEN" x 


c1-- Qualified Names (Default) ......................... --- 


€1ENTİTY 55 SVG.a.qname "a" x 


c1-- Attribute Collections (Default) ................... --- 
€IENTİTY 55 SVG.Core.attrib "" s 
€IENTİTY $ SVG.Conditional.attrib "" s 
€lENTİTY $ SVG.Style.attrib "" s 
€IENTİTY $ SVG.Vievport.attrib "" s 
€IENTİTY $ SVG.Text.attrib "" s 
€IENTİTY $ SVG.TextContent.attrib "" s 
€IENTİTY 5 SVG.Font.attrib "" s 
€lENTİTY $ SVG.Paint.attrib "" s 
€lENTİTY 55 SVG.Color.attrib "" s 
€IENTİTY $ SVG.Üpacity.attrib "" s 
€IENTİTY $ SVG.Graphics.attrib "" s 
€lENTİTY 55 SVG.Marker.attrib "" s 
€IENTİTY $ SVG.Gradient.attrib "" 
€lENTİTY $ SVG.Clip.attrib "" s 
€IENTİTY 55 SVG.Mask.attrib "" s 
€lENTİTY $ SVG.Filter.attrib "" s 
€IENTİTY $ SVG.FilterColor.attrib "" s 
€lENTİTY 55 SVG.GraphicalEvents.attrib "" s 
€lENTİTY 55 SVG.Cursor.attrib "" s 
€IENTİTY $ SVG.XLinkReplace.attrib "" s 
€IENTİTY 5 SVG.External.attrib "" 


c1-- SVG.Hyperlink.class ............................... --5 


€1ENTİTY 55 SVG.Hyperlink.extra.class "" s 
€1ENTİTY 55 SVG.Hyperlink.class 
"1 S5SVG.a.qname, S55VG.Hyperlink.extra.class," 


z 


c1-- SVG.Presentation.attrib ........................... --- 
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€lENTİTY $ SVG.Presentation.extra.attrib "" s 


€IENTİTY $ SVG.Presentation.attrib 
"SSVG.Container.attrib, 
358VG.Vieuvport.attrib, 
555VG.Text.attrib, 
558VG.TextContent.attrib, 
958VG.Font.attrib, 
9558VG.Paint.attrib, 
358VG.Color.attrib, 
555VG.Opacity.attrib, 
555VG.Graphics.attrib, 
358VG.Marker.attrib, 
358VG.ColorProfile.attrib, 
358VG.Gradient.attrib, 
358V6.Clip.attrib, 
555VG.Mask.attrib, 
S5VG.Filter.attrib, 
358VG.FilterColor.attrib, 
555VG.Cursor.attrib, 
Tlood-color SsSVGColor.datatype, £IMPLIED 
T1ood-opacity 5Ss0pacityValue.datatype, £T1MPLTED 
lighting-color S5:SVGColor.datatype, £TMPLTED 
358VG.Presentation.extra.attrib," 





z 
e€1-- a: Anchor Element ................................. --- 
€IENTİTY 55 SVG.a.extra.content "" s 


€1ENTİTY 55 SVG.a.element "İNCLUDE" 5 

el İ555VG.a.element, 1 

€ENTİTY 55 SVG.a. content 

"( £PCDATA 1 $5SVG.Description.class, 1 55SVG.Animation.class, 

555VG.Structure.class, 5S58VG.Conditional.class, 5S:SVG.Image. class, 
358VG.Style.class, S5SVG. Shape .class, S5SVG.Text.class, S5SVG.Marker.class, 
358VG.ColorProfile. class, S5:SVG.Gradient.class, 55SVG.Pattern.class, 
358VG.Clip.class, 3:58VG.Mask.class, 3558VG.Filter.class, S5SVG.Cursor.class, 
35SVG.Hyperlink. class, 3:SVG.Viev. class, 358VG.Script.class, 
358VG.Font.class, 958VG.Extensibility.class, S5SVG.a.extra.content, )“" 

z 

€ ELEMENT S:SVG.a .qname, S5:5VG.a. content, x 

xc1-- end of SVG.a.element --x115 


€IENTİTY $ SVG.a.attlist "INCLUDE" 5 

el İ8SVG.a.attlist,l 

€ ATTLIST S5SVG.a .qname 
S58VG.Core.attrib, 
S5SVG.Conditional.attrib, 
S58VG.Style.attrib, 
S58VG.Presentation.attrib, 
S58VG.GraphicalEvents.attrib, 
S5SVG6.XLinkReplace.attrib, 
S5SVG.External.attrib, 
transform $:TransformList.datatype, £T1MPLTED 
target SssLinkTarget.datatype, £1MPLIED 

z 

c1-- end of SVG.a.attlist --s115 


c1-- end of svg-hyperlink.mod --x 


A.3.36 Vievv Module 


The Vievv Module defines the Vievv.class element collection. 
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Collection name İ Elements in collection 


Vievv.class 








sə r əə İR İİ S 0 
c1-- SVG 1.1 Viev Module 
c1-- file: svg-viev.mod 
This is SVG, a language for describing tvo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), ALL Rights Reserved. 
Revision: $I1d: svg-viev.mod,v 1.2 2011/07/08 03:18:59 cmccorma Exp $ 
This DTD module is identified by the PUBLIC and SYSTEM identifiers: 
PUBLIC "-//3C//ELEMENTS SVG 1.1 Viev//EN" 
SYSTEM "http: / /uvv .v/3..org/Graphics/SVG/1.1/DTD/svg-viev.mod" 
20005” ”.”-—..... --- 
c1-- Viev 
Viev 
This module declares markup to provide support for viev. 
--- 
c€1-- Qualified Names (Default) ......................... --5 


€ VENTİTY 5. SVG.viev.qname "viev" s 


c1-- Attribute Collections (Default) ................... 2-5 
€lENTİTY $ SVG.Core.attrib "" s 

€IENTİTY $ SVG.External.attrib "" 

sl SVG-Viev.elass ə aa ys Vd Da aşya --5 


€ENTİTY 55 SVG.Viev.extra. class "" s 


€ VENTİTY 5. SVG.Viev.class 
"1 SSVG.viev.qname, 55SVG.Viev.extra.class," 
z 


e1-- viev: Viev Element ................................ 5 
€lENTİTY 55 SVG.viev.extra. content "" s 

€lENTİTY 55 SVG.viev.element "İNCLUDE" 5 

cl İSSVG.viev.element, 1 


€lENTİTY $ SVG.viev.content 
"( S5SVG.Description.class, S:SVG.viev.extra.content, )”" 


- 
ce ELEMENT 5:SVG.viev.qname, S55VG.viev. content, x 
c1-- end of SVG.viev.element --x115 


€IENTİTY $ SVG.viev.attlist "INCLUDE" x 
eIlİSSVG.viev.attlist,l 
€ ATTLIST S:SVG.viev.qname, 
S5SVG.Core.attrib, 
Ss5SVG.External.attrib, 
vievBox S:VievBoxSpec.datatype, £1MPLIED 
preserveAspectRatio 5:PreserveAspectRatioSpec.datatype, "xMidYMid meet" 
zoomAndPan ( disable / magnify ) "magnify" 
vievTarget CDATA £IMPLIED 
z 
c1-- end of SVG.viev.attlist ---ll- 


c1-- end of svg-viev.mod --x 


A.3.37 Scripting Module 


"The Seript Module defines the Seript.class element collection. 
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Ə R 7 0 ZAQ O --- 
e€1-- SVG 1.1 Scripting Module .............................................. --5 
c1-- file: svg-script.mod 


This is SVG, a language for describing tvo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), ATLI Rights Reserved. 
Revision: $I1d: svg-script.mod,v 1.2 2011/07/08 03:18:59 cmccorma Exp $ 


This DTD module is identified by the PUBLIC and SYSTEM identifiers: 





PUBLIC "-//M3C//ELEMENTS SVG 1.1 Scripting//EN" 
SYSTEM "http: / /vvv/.v3.org/Graphics/SVG/1.1/DTD/svg-script.mod" 


c1-- Scripting 
script 


This module declares markup to provide support for scripting. 
--- 


c1-- Qualified Names (Default) ......................... --5 
€IENTİTY $ SVG.script.qname "script" xs 

c1-- Attribute Collections (Default) ................... 2-5 
€IENTİTY $ SVG.Core.attrib "" s 

€lENTİTY $ SVG.XLink.attrib "" s 

€IENTİTY $ SVG.External.attrib "" 

eı-- SV6:Seript:class s əəə əy a di RARaRa Rana ROROR BARME UR R RARNERSesi -- 
€lENTİTY $ SVG.Script.extra.class "" s 

€lENTİTY $ SVG.Script.class 


"1 S5SVG.script.qname, S55VG.Script.extra.class," 
z 


e1-- script: Script Element ............................ -- 
€lENTİTY $ SVG.script.extra.content "" s 

€lENTİTY $ SVG.script.element "IİNCLUDE" x 

cl İSSVG.script.element, 1 


€lENTİTY $ SVG.script.content 
"( SPCDATA SSVG.script.extra.content, )”" 


- 
€ ELEMENT 5:S8VG.script.qname, S:5VG.script.content, x 
c1-- end of SVG.script.element --s11- 


€lENTİTY $ SVG.script.attlist "INCLUDE" x 
elİSSVG.script.attlist,1 
€ IATTLIST S:S8VG.script.qname, 
S5SVG.Core.attrib, 
s5SV6.XLink.attrib, 
s5SVG.External.attrib, 
type "sContentType .datatype, 2£5REQUTRED 
z 
c1-- end of SVG.script.attlist --s1l 


c1-- end of svg-script.mod --s 


A.3.38 Animation Module 


The Animation Module defines the Animation.class element collection and the Animation.attrib, AnimationAt- 
tribute.attrib, Animation Timing.attrib, AnimationValue.attrib and AnimationAddtion.attrib attribute collections. 


Collection name Elements in collection 
Animation.class İ animate, animateColor, animateTransform, animateMotion, set 


Collection name Attributes in collection 
Animation.attrib XLink.attrib 
AnimationAttribute.attrib İ attributeName, attributeType 
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AnimationTiming.attrib İ begin, dur, end, min, max, restart, repeatCount, repeatDur, fil 
AnimationValue.attrib İcalcMode, values, keyTimes, keySplines, from, to, by 
AnimationAddition.attrib İ additive, accumulate 


2577”. ””””””” --- 
e1-- $VG 1.1 Animation Module: .......u ə ai aa kek sla yera Rad aaa basır --- 
c1-- file: svg-animation.mod 





This is SVG, a language for describing tuvo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), All Rights Reserved. 
Revision: $1d: svg-animation.mod,v 1.4 2011/07/08 03:18:58 cmccorma Exp $ 


This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//3C//ELEMENTS SVG 1.1 Animation//EN" 
SYSTEM "http: / vv .v3.org/Graphics/SVG/1.1/DTD/svg-animation.mod" 


c1-- Animation 
animate, set, animateMotion, animateColor, animateTransform, mpath 


This module declares markup to provide support for animation. 
--- 


c1-- Qualified Names (Default) ......................... --5 


€IENTİTY 
SlENTİTY 
€IENTİTY 
SIENTİTY 
€IENTİTY 
€lENTİTY 


SVG.animate.qname "animate" x 

SVG.set.qname "set" x 

SVG.animateMotion.qname "animateMotion" x 
SVG.animateColor.qname "animateColor" x 
SVG.animateTransform.qname "animateTransform" x 
SVG.mpath.qname "mpath" x 


9? 99 0? o? o? ap 


c1-- Attribute Collections (Default) ................... --- 


€lENTİTY 
€lENTİTY 
€lENTİTY 
€lENTİTY 
€IENTİTY 
€IENTİTY 


SVG.Core.attrib "" s 
SVG.Conditional.attrib "" s 
SVG.AnimationEvents.attrib "" s 
SVG.XLink.attrib "" s 
SVG.XLinkRequired.attrib "" s 
SVG.External.attrib "" s 


99 9? o? o? o? op 


e€1-- SVG.Animation.class ............................... 5 


€lENTİTY $ SVG.Animation.extra.class "" 


€IENTİTY $ SVG.Animation.class 
"S5SVG.animate .qname, 1 5S:SVG.set.qname, 1 S55VG.animateMotion.qname, 1 
555VG.animateColor .qname, 1 555VG.animateTransform.qname , 
555VG.Animation.extra.class," 

z 


e€1-- SVG.Animation.attrib .............................. --- 
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€IENTİTY $ SVG.Animation.extra.attrib "" s 


€IENTİTY $ SVG.Animation.attrib 
"SSVG.XLink.attrib, 
958VG.Animation.extra.attrib," 
z 


c1-- SVG.AnimationAttribute.attrib ..................... --- 
€IENTİTY $ SVG.AnimationAttribute.extra.attrib "" s 


€IENTİTY $ SVG.AnimationAttribute.attrib 
"attributeName CDATA 4“/REQUTIRED 
attributeType CDATA £“TMPLIED 
358VG.AnimationAttribute.extra.attrib," 
z 





c1-- SVG.AnimationTiming.attrib ........................ --- 
€1ENTİTY $ SVG.AnimationTiming.extra.attrib "" 5 


€1ENTİTY 6 SVG.AnimationTiming.attrib 
"begin CDATA £TIMPLIED 
dur CDATA £TMPLTED 
end CDATA £TMPLTED 
min CDATA £IMPLIED 
max CDATA £IMPLIED 
restart ( alvays /l never 1 vhenNotActive ) "aluvays" 
repeatCount CDATA £TMPLTED 
repeatDur CDATA £TMPLTED 
fill ( remove 1 freeze ) "remove" 
55VG.AnimationTiming.extra.attrib," 
z 


c1-- SVG.AnimationValue.attrib ......................... --- 
€IENTİTY $ SVG.AnimationValue.extra.attrib "" s 


€lENTİTY $ SVG.AnimationValue.attrib 
"calcMode ( discrete 1 linear İl paced 1 spline ) "linear" 
values CDATA £IMPLIED 
keyTimes CDATA £TMPLTED 
keySplines CDATA £TMPLTED 
Trom CDATA £TIMPLIED 
to CDATA FIMPLIED 
by CDATA £IMPLIED 
358VG.AnimationValue.extra.attrib," 
- 


c1-- SVG.AnimationAddtion.attrib 





€IENTİTY $ SVG.AnimationAddtion.extra.attrib "" s 


€IENTİTY $ SVG.AnimationAddtion.attrib 
"additive ( replace Il sum ) "replace" 
accumulate ( none 1 sum ) "none" 
9558VG.AnimationAddtion.extra.attrib," 
z 


c1-- animate: Animate Element .......................... --- 
€lENTİTY 55 SVG.animate.extra.content "" s 


€IENTİTY $ SVG.animate.element "INCLUDE" 5 
cl İS5SVG.animate .element, 1 
€IENTİTY $ SVG.animate.content 
"( $SVG.Description.class, S5:SVG.animate.extra.content, )”" 
- 
€ ELEMENT 5“:SVG.animate .qname, 555VG.animate . content, x 


xc1-- end of SVG.animate .element --s115 


€IENTİTY $ SVG.animate.attlist "INCLUDE" 5 

ce İ8SSVG.animate.attlist,1 

€ 1ATTLIST S:SVG.animate . qname , 
S5SVG.Core.attrib, 
S5SVG.Conditional.attrib, 
S5SVG.AnimationEvents.attrib, 
S5SVG.External.attrib, 
SSVG.Animation.attrib, 
S5VG.AnimationAttribute.attrib, 
S58VG.AnimationTiming.attrib, 
S5SVG.AnimationValue.attrib, 
SSVG.AnimationAddtion.attrib, 
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- 
c1-- end of SVG.animate.attlist --s115 


sız set: Set Element: cə ayy pa yaya Ropşasaşaə --- 
€lENTİTY 55 SVG.set.extra.content "" s 

€lENTİTY 55 SVG.set.element "INCLUDE" 5 

cl İS5SVG. set .element, 1 


€1ENTİTY 55 SVG.set.content 
"( $SVG.Description.class, S:SVG.set.extra.content, )”" 





- 
c ELEMENT 5:SVG. set .qname, S5SVG.set.content, xs 
xc1-- end of SVG.set.element --s115 


€IENTİTY $ SVG.set.attlist "INCLUDE" 5 

cl 558VG.set.attlist,l 

€ ATTLIST S:SVG.set.qname, 
S5SVG.Core.attrib, 
S5VG.Conditional.attrib, 
S5SVG.AnimationEvents.attrib, 
S5SVG.External.attrib, 
S5SVG.Animation.attrib, 
S5SVG.AnimationAttribute.attrib, 
S58VG.AnimationTiming.attrib, 
to CDATA £FIMPLIED 

z 

c1-- end of SVG.set.attlist --s115 





c€1-- animateMotion: Animate Motion Element ............. --- 
€lENTİTY $ SVG.animateMotion.extra.content "" s 


€IENTİTY $ SVG.animateMotion.element "INCLUDE" 5 
cl İ555VG.animateMotion.element, 1 
€lENTİTY $ SVG.animateMotion.content 
"( ( S5SVG.mpath .qname, , 
( $SVG.Description.class, S5SVG.animateMotion.extra.content, )” ) 
I ( ( $SVG.Description.class, 555VG.animateMotion.extra.content, )H, 
555VG .mpath .qname, , 
( ( $SVG.Description.class, S58VG.animateMotion.extra.content, )“ )? ) )" 
z 
€ ELEMENT S:SVG.animateMotion.qname, 5:8VG.animateMotion.content, x 
€1-- end of SVG.animateMotion.element --x11- 


€IENTİTY $ SVG.animateMotion.attlist "INCLUDE" x 
c18SVG.animateMotion.attlist,l 
€1ATTLIST S:SVG.animateMotion .qname , 
S58VG.Core.attrib, 
S5SVG.Conditional.attrib, 
S5SVG.AnimationEvents.attrib, 
S5SVG.External.attrib, 
SSVG.Animation.attrib, 
S58VG.AnimationTiming.attrib, 
S5VG.AnimationAddtion.attrib, 
calcMode ( discrete 1 linear 1 paced 1 spline ) "paced" 
values CDATA £IMPLIED 
keyTimes CDATA £TMPLTED 
keySplines CDATA £TMPLTED 
Trom CDATA £TIMPLIED 
to CDATA £IMPLIED 
by CDATA £IMPLIED 
path CDATA £TIMPLIED 
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keyPoints CDATA £TMPLIED 
rotate CDATA ZTIMPLIED 
origin CDATA £1MPLIED 
z 
c1-- end of SVG.animateMotion.attlist --s115 


c1-- animateColor: Animate Color Element ............... --- 
€IENTİTY $ SVG.animateColor.extra. content "" s 

€lENTİTY 55 SVG.animateColor.element "INCLUDE" 5 

el İ55SVG.animateColor .element, 1 


€lENTİTY 55 SVG.animateColor.content 
"( $SVG.Description.class, S:SVG.animateColor.extra.content, )“" 


z 
e ELEMENT 55SVG ..animateColor .qname, “:5VG.animateColor.content, 5 
xc1-- end of SVG.animateColor.element --5115 


€IENTİTY $ SVG.animateColor.attlist "INCLUDE" 5 

cl İ8SVG.animateColor.attlist,1 

€ATTLIST S5:SVG.animateColor .qname , 
S5SVG.Core.attrib, 
S5SVG.Conditional.attrib, 
S5SVG.AnimationEvents.attrib, 
S5SVG.External.attrib, 
SSVG.Animation.attrib, 
S5VG.AnimationAttribute.attrib, 
S58VG.AnimationTiming.attrib, 
S58VG.AnimationValue.attrib, 
SSVG.AnimationAddtion.attrib, 

z 

c1-- end of SVG.animateColor.attlist --sll- 


c1-- animateTransform: Animate Transform Element ....... -- 
€lENTİTY 5 SVG.animateTransform.extra. content "" s 

€IENTİTY 55 SVG.animateTransform.element "INCLUDE" 5 

cl İS5SVG.animateTransform.element, 1 


€lENTİTY 55 SVG.animateTransform.content 
"( $SVG.Description.class, S:SVG.animateTransform.extra.content, )”" 


z 
e ELEMENT 5:SVG ..animateTransform.qname, “:5VG.animateTransform.content, x 
xc1-- end of SVG.animateTransform.element --s115 


€IENTİTY $ SVG.animateTransform.attlist "INCLUDE" 5 

cl İS5SVG.animateTransform.attlist,1 

€ ATTLIST S5:SVG.animateTransform.qname , 
S5SVG.Core.attrib, 
S5SVG.Conditional.attrib, 
S5SVG.AnimationEvents.attrib, 
S5SVG.External.attrib, 
SSVG.Animation.attrib, 
S5SVG.AnimationAttribute.attrib, 
S58VG.AnimationTiming.attrib, 
S58VG.AnimationValue.attrib, 
SSVG.AnimationAddtion.attrib, 
type ( translate / scale 1 rotate l skevX 1 skevY ) "translate" 





z 
c1-- end of SVG.animateTransform.attlist --s11s 
c€1-- mpath: Motion Path Element ........................ --5 


€IENTİTY 55 SVG.mpath.extra.content "" s 


€ENTİTY 55 SVG.mpath.element "İNCLUDE" 5 
cl İ55SVG.mpath element, 1 
€lENTİTY 55 SVG.mpath. content 
"( $5SVG.Description.class, S:SVG.mpath.extra.content, )”" 
- 
ce ELEMENT 5:SVG.mpath..qname, S55VG.mpath. content, xs 
c1-- end of SVG.mpath.element --x11- 


€IENTİTY $ SVG.mpath.attlist "INCLUDE" 5 

cl İ555VG.mpath.attlist,l 

€ ATTLIST 55SVG.mpath..qname , 
S5SVG.Core.attrib, 


S5SVG6.XLinkRequired.attrib, 
S5SVG.External.attrib, 
z 


c1-- end of SVG.mpath.attlist --s115 


c1-- end of svg-animation.mod --x 
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A.3.39 Font Module 


The Font Module defines the Font.class element collection. 


Elements in collection 
font, font-face 





c1-- file: svg-font.mod 
This is SVG, a language for describing tvo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), ALL Rights Reserved. 
Revision: $Id: svg-font.mod,v 1.6 2011/07/08 03:18:58 cmccorma Exp $ 
This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//3C/ /ELEMENTS SVG 1.1 Font//EN" 
SYSTEM "http: / /vvv/.vV3.org/Graphics/SVG/1.1/DTD/svg-Tont.mod" 


c1-- Font 


font, font-face, glyph, missing-glyph, hkern, vkern, font-face-src, 
font-face-uri, font-face-format, font-face-name 


This module declares markup to provide support for template. 


--- 
c1-- Qualified Names (Default) ......................... --- 
€VENTİTY 55 SVG.font.qname "font" s 

€lENTİTY 55 SVG.font-fTace.qname "font-face" s 

€1ENTİTY 55 SVG.glyph.qname "glyph" s 

€lENTİTY $ SVG.missing-glyph.qname "missing-glyph" x 
€lENTİTY 55 SVG.hkern.qname "hkern" x 

€ENTİTY 55 SVG.vkern.qname "vkern" s 

€ENTİTY 55 SVG.font-face-src.qname "font-face-src" s 
€IENTİTY 55 SVG.font-face-uri.qname "font-face-uri" xs 

€ ENTİTY 55 SVG. font-fTace-format.qname "Tont-face-format" x 

€ VENTİTY 55 SVG.font-fTace-name.qname "Tont-face-name" x 

c1-- Attribute Collections (Default) ................... --- 
€IENTİTY 55 SVG.Core.attrib "" s 

€lENTİTY $ SVG.Container.attrib "" s 

€lENTİTY $ SVG.Style.attrib "" s 

€IENTİTY $ SVG.Vievport.attrib "" 

€IENTİTY $ SVG.Text.attrib "" s 

€lENTİTY $ SVG.TextContent.attrib "" s 

€IENTİTY $ SVG.Font.attrib "" s 

€IENTİTY $ SVG.Paint.attrib "" s 

€IENTİTY 55 SVG.Color.attrib "" s 

€IENTİTY $ SVG.Üpacity.attrib "" s 

€IENTİTY $ SVG.Graphics.attrib "" 

€lENTİTY 55 SVG.Marker.attrib "" s 

€lENTİTY $ SVG.ColorProfile.attrib "" s 

€IENTİTY $ SVG.Gradient.attrib "" 

€IENTİTY $ SVG.Clip.attrib "" s 

€IENTİTY 55 SVG.Mask.attrib "" s 

€lENTİTY $ SVG.Filter.attrib "" s 


€IENTİTY $ SVG.FilterColor.attrib "" s 
€lENTİTY 55 SVG.Cursor.attrib "" s 
€1ENTİTY $ SVG.XLinkRequired.attrib "" 5 
€IENTİTY $ SVG.External.attrib "" 


sil VG: Font::elass sey sə əsə ya a apa das -- 


€VENTİTY 55 SVG.Font.extra. class "" s 
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€ENTİTY 55 SVG.Font.class 
"1 S5SVG.font.qname, 1 S:SVG.font-face .qname, 555VG.Font.extra.class," 
z 


e€1-- SVG.Presentation.attrib ........................... --- 
€IENTİTY $ SVG.Presentation.extra.attrib "" s 


€IENTİTY $ SVG.Presentation.attrib 
"SSVG.Container.attrib, 
358VG.Vieuvport.attrib, 
558VG.Text.attrib, 
558VG.TextContent.attrib, 
958VG.Font.attrib, 
358VG.Paint.attrib, 
558VG.Color.attrib, 
555VG.Opacity.attrib, 
358VG.Graphics.attrib, 
358VG.Marker.attrib, 
358VG.ColorProfile.attrib, 
358VG.Gradient.attrib, 
358V6.Clip.attrib, 
358VG.Mask.attrib, 
S58VG.Filter.attrib, 
S58V6.FilterColor.attrib, 
358VG.Cursor.attrib, 
T1ood-color S:SVGColor.datatype, £TIMPLIED 
Tlood-opacity 5$s0pacityValue.datatype, £1MPLTED 
lighting-color S5:SVGColor.datatype, £TMPLTED 
358VG.Presentation.extra.attrib," 





z 
e1-- font: Font Element ................................ --- 
€IENTİTY 55 SVG.font.extra.content "" s 


€1ENTİTY 55 SVG.font.element "INCLUDE" x 
el İ55SVG. font.element, 1 
€lENTİTY 55 SVG.font.content 
"( S5SVG.Description.class, 1 5:SVG.font-face.qname, 
İ “SVG.missing-glyph.qname, 1 555VG.glyph.qname, İl S5SVG.hkern .qname 
İ “55VG.vkern.qname, 5:5VG. font.extra.content, )“" 
z 
c ELEMENT 5:SVG. font.qname, S55VG. font.content, xs 
c1-- end of SVG.font.element --x11- 


€IENTİTY $ SVG.font.attlist "INCLUDE" x 

cl İ8SVG.font.attlist,l 

€ ATTLIST 5:SVG.font.qname, 
S5SVG.Core.attrib, 
S5SVG.Style.attrib, 
9658VG.Presentation.attrib, 
S5SVG.External.attrib, 
horiz-origin-x 55Number..datatype, £T1MPLTED 
horiz-origin-y S:Number .datatype, £T1MPLTED 
horiz-adv-x "sNumber .datatype, ““REQUTRED 
vert-origin-x s:Number..datatype, 2”TMPLIED 
vert-origin-y s:Number..datatype, 2”TMPLIED 
vert-adv-y ?sNumber .datatype, “£T1MPLIED 

z 

c1-- end of SVG.font.attlist --s11l- 


c1-- font-face: Font Face Element ...................... --- 
€IENTİTY 55 SVG.font-face.extra.content "" s 


€1ENTİTY 55 SVG.font-fTace.element "INCLUDE" 5 
cl İ55SVG. font- face .element, 1 


€ENTİTY 55 SVG.font-face.content 
"( ( S5SVG.font-face-src.qname, , 
( 55SVG.Description.class, S:SVG. font-face.extra.content, )” ) 
İ ( ( S5SVG.Description.class, 955VG. font-face.extra.content, )H, 
35SVG. font-face-src.qname, , 
( ( $SVG.Description.class, 9:SVG. font-face.extra.content, )” )? ) )" 
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z 
€ ELEMENT S:SVG. font- face. qname, S5SVG. font-face. content, x 
c€1-- end of SVG.font-face.element --s11- 


€VENTİTY $ SVG.font-face.attlist "INCLUDE" x 

cl İSSVG.font-face.attlist,1l 

€ ATTLIST S:SVG. font-Tace . qname, 
S5SVG.Core.attrib, 
font-family CDATA £IMPLIED 
Tont-style CDATA £1MPLIED 
font-variant CDATA £1MPLTIED 
font-veight CDATA £IMPLIED 
font-stretch CDATA £1MPLTED 
font-size CDATA £1MPLIED 
unicode- range CDATA £1MPLTIED 
units-per-em 5?:Number .datatype, “£IMPLIED 
panose-1 CDATA £IMPLIED 
stemv $:Number .datatype, 2TMPLIED 
stemh S:Number .datatype, 2TMPLIED 
slope S:Number .datatype, 25TMPLIED 
cap-height s:Number .datatype, £T1MPLIED 
x-height 535Number.datatype, £IMPLTIED 
accent-height s:Number .datatype, £1MPLTIED 
ascent ss:Number .datatype, “”IMPLIED 
descent ss:Number .datatype, “/TMPLIED 
vidths CDATA £IMPLIED 
bbox CDATA £TMPLIED 
ideographic s:Number .datatype, “”IMPLIED 
alphabetic s:Number .datatype, £1MPLIED 
mathematical s:Number .datatype, “2“TMPLTED 
hanging ?:Number..datatype, “£IMPLIED 
v-ideographic ?:Number .datatype, “£IMPLIED 
v-alphabetic s:Number .datatype, 2”TMPLTED 
v-mathematical s:Number .datatype, £1MPLIED 
v-hanging sS:Number .datatype, “2”TMPLIED 
underline-position 5:Number..datatype, £IMPLIED 
underline-thickness s:Number .datatype , 2£TMPLTED 
strikethrough-position 5:Number .datatype, 2£TMPLIED 
strikethrough-thickness 9?s:Number .datatype, 4£”IMPLIED 
overline-position "Number .datatype, 4£IMPLIED 
overline-thickness 9?:Number .datatype, £1MPLTIED 








z 
c€1-- end of SVG.font-face.attlist --slls 


sil glyph: “Güyph “Etenentt - cü üə osa yeva sbale 4as --- 
€IENTİTY 55 SVG.glyph.extra.content "" s 


€VENTİTY 5 SVG.glyph.element "İNCLUDE" x 

cl İ555VG.glyph.element, 1 

€1ENTİTY 5 SVG.glyph. content 

"( S5SVG.Description.class, 1 S5:8VG.Animation.class, 5S5SVG.Structure.class, 

555VG.Conditional.class, S:SVG.Tmage. class, 55SVG.Style.class, 
35SVG .Shape. class, S5SVG. Text.class, S5SVG.Marker.class, 
Se5SVG.ColorProfile.class, S5SVG.Gradient.class, 955VG.Pattern.class, 
358VG.Clip.class, 3:5VG.Mask.class, 3558VG.Filter.class, S:SVG.Cursor.class, 
35SVG.Hyperlink.class, 3:SVG.Viev. class, 358VG.Script.class, 
358VG.Font.class, 958VG.Extensibility.class, $5SVG.glyph.extra.content, )”" 

z 

€ ELEMENT S:SVG.glyph ..qname, 55:5VG.glyph.content, x 

xc1-- end of SVG.glyph.element --x115 


€VENTİTY $ SVG.glyph.attlist "INCLUDE" 5 
cl (555VG.glyph.attlist,l 
€ ATTLIST S5:SVG.glyph..qname 
S5SVG.Core.attrib, 
S5SVG.Style.attrib, 
S5SVG.Presentation.attrib, 
unicode CDATA £TMPLTED 
glyph-name CDATA £1MPLTED 
d ssPathData.datatype, 2£1MPLIED 
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orientation CDATA £IMPLIED 
arabic-form CDATA £1MPLTED 
1ang “sLanguageCodes .datatype, £1MPLTED 
horiz-adv-x s:Number .datatype, “/TMPLIED 
vert-origin-x s:Number .datatype, 2”TMPLIED 
vert-origin-y s:Number..datatype, “2”IMPLIED 
vert-adv-y ssNumber .datatype, £T1MPLTED 

z 

c1-- end of SVG.glyph.attlist --s115 


c1-- missing-glyph: Missing Glyph Element .............. --- 
€1ENTİTY $ SVG.missing-glyph.extra.content "" s 


€1ENTİTY $ SVG.missing-glyph.element "INCLUDE" 5 

cl (958VG.missing-glyph.element, 1 

€1ENTİTY $ SVG.missing-glyph.content 

"( S5SVG.Description.class, 1 55:8VG.Animation.class, 5S55VG.Structure.class, 

555VG.Conditional.class, S:SVG.TImage. class, 55SVG.Style.class, 
35SVG.Shape.. class, S5SVG. Text. class, S5SVG.Marker.class, 
35SVG.ColorProfile. class, S5:SVG.Gradient.class, 55SVG.Pattern.class, 
358VG.Clip.class, 3:5VG.Mask.class, 355VG.Filter.class, S:SVG.Cursor.class, 
555VG.Hyperlink.class, 5S:SVG.Viev.class, S58VG.Secript.class, 
555VG.Font.class, $5VG.Extensibility.class, S5SVG.missing-glyph.extra.content, 

.. 

€ ELEMENT 5:8VG.missing-glyph.qname, 555VG.missing-glyph.content, x 

c1-- end of SVG.missing-glyph.element --s115 


€1ENTİTY $ SVG.missing-glyph.attlist "INCLUDE" 5 

cl S5VG.missing-glyph.attlist,1 

€ IATTLIST 5:S8VG.missing-glyph.qname, 
S58VG.Core.attrib, 
S5SVG.Style.attrib, 
S58VG.Presentation.attrib, 
d ssPathData.datatype, 2£1MPLIED 
horiz-adv-x s:Number .datatype, “/IMPLIED 
vert-origin-x s:Number .datatype, “3”IMPLIED 
vert-origin-y s:Number .datatype, 2”TMPLIED 
vert-adv-y ?sNumber .datatype, “£T1MPLTED 

z 

c1-- end of SVG.missing-glyph.attlist --s115 


c1-- hkern: Horizontal Kerning Element ................. 5 


€ENTİTY 55 SVG.hkern.element "INCLUDE" 5 

el f55SVG .hkern.element, 1 

€VENTİTY 55 SVG.hkern. content "EMPTY" 5 

€ ELEMENT S“SVG..hkern .qname 555VG.hkern.content, x 
c1-- end of SVG.hkern.element --x115 


€lENTİTY $ SVG.hkern.attlist "INCLUDE" 5 
cl (555VG.hkern.attlist,l 
€ ATTLIST S5SVG..hkern .qname 
S5SVG.Core.attrib, 
u1 CDATA £IMPLIED 
g1 CDATA £IMPLIED 
u2 CDATA £IMPLIED 
g2 CDATA £IMPLIED 
k ssNumber .datatype, “2£REQUTRED 
z 
c1-- end of SVG.hkern.attlist --s1l1- 


c1-- vkern: Vertical Kerning Element ................... --- 


€1ENTİTY 55 SVG.vkern.element "INCLUDE" 5 

cl f958VG.vkern. element, 1 

€VENTİTY 55 SVG.vkern.content "EMPTY" 5 

€ ELEMENT 5“:SVG.vkern.qname, 5:5VG.vkern.content, xs 
c1-- end of SVG.vkern.element --s115 


€lENTİTY $ SVG.vkern.attlist "INCLUDE" 5 
cl (555VG.vkern.attlist,l 
€ ATTLIST S:SVG.vkern .qname 
S5SVG.Core.attrib, 
u1 CDATA £IMPLIED 
g1 CDATA £IMPLIED 
u2 CDATA £IMPLIED 
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g2 CDATA Z£TMPLIED 
k ssNumber .datatype, “2£REQUTRED 
z 
c1-- end of SVG.vkern.attlist --s115 


c1-- font-face-src: Font Face Source Element ........... --- 
€ENTİTY 55 SVG. font-face-src.extra.content "" s 


€IENTİTY 55 SVG.font-face-src.element "INCLUDE" 5 
el İS5SVG. font-face-src.element, 1 
€ENTİTY 55 SVG.font-fTace-src.content 

"( S5SVG.font-face-uri.qname, 1 5:SVG. font- face-name .qname , 

S5SVG. font-face-src.extra.content, )a" 

z 
€ ELEMENT S:SVG. font-face-src.qname , 3S5SVG. font-face-src.content, x 
c1-- end of SVG.font-face-src.element --x11- 


€IENTİTY $ SVG.font-face-src.attlist "INCLUDE" x 

cl 155SVG. font-face-src.attlist,l 

€ ATTLIST S5SVG. font-face-src.qname , 
S5SVG.Core.attrib, 





z 
€1-- end of SVG.font-face-src.attlist --c11- 


c1-- font-face-uri: Font Face URI Element .............. --- 
€lENTİTY 55 SVG.font-face-uri.extra.content "" s 


€IENTİTY $ SVG.font-face-uri.element "INCLUDE" 5 
cl (555VG. font-face-uri.element, 1 
€lENTİTY $ SVG.font-face-uri.content 

"( S5SVG. font-fTace-fTormat .qname, S:5VG. font-face-uri.extra.content, 
z 
€ ELEMENT S:SVG. font-face-uri.qname, S:5VG.font-face-uri.content, x 
c1-- end of SVG.font-face-uri.element --x11- 


€IENTİTY $ SVG.font-face-uri.attlist "INCLUDE" x 
cl 8SVG.font-face-uri.attlist,l 
€ ATTLIST S:SVG. font-face-uri.qname , 
S58VG.Core.attrib, 
S5SV6.XLinkRequired.attrib, 





z 
c1-- end of SVG.font-face-uri.attlist --s115 
c1-- font-face-format: Font Face Format Element ........ --- 


€ENTİTY 55 SVG.font-face-format 
el İ55SVG. font-face-format.elemen 


€lENTİTY 55 SVG.font-face-format. 
. qname, 5:SVG. font-face-format .content, x 


c ELEMENT 55:SVG. font-Tace-format 
xc1-- end of SVG.font-face-forma 


€lENTİTY 55 SVG.font-face-format. 


cl 155SVG.font-face-format.attlis 
€ ATTLIST 5:SVG. font-fTace-format 


.element "INCLUDE" x 


1 
content "EMPTY" x 


.element --s11s 


attlist "INCLUDE" 5 
(1 


.qname , 


S5SVG.Core.attrib, 
string CDATA £IMPLIED 
z 
c1-- end of SVG.font-face-format.attlist --sl1s 





c1-- font-face-name: Font Face Name Element ............ --- 


€ENTİTY 55 SVG.font-fTace-name.element "INCLUDE" 5 

cl İ55SVG. font- face-name . element, 1 

€ENTİTY 55 SVG. font-Tace-name. content "EMPTY" s 

€ ELEMENT S:SVG. font-fTace-name .qname, 5:5VG. font-face-name . content, x 
c1-- end of SVG.font-face-name. element --s11- 


€lENTİTY $ SVG.font-face-name.attlist "INCLUDE" x 
cl İS5SVG. font-Tface-name attlist, 1 
€ ATTLIST S:SVG. font-face-name .qname, 
S5SVG.Core.attrib, 
name CDATA £TMPLIED 
z 
c1-- end of SVG.font-face-name.attlist --sll- 


yer 


xc1-- end of svg-fTont.mod --x 


A.3.40 Basic Font Module 
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The Basic Font Module defines the Font.class element collection. 


Collection name İ Elements in collection 
Font.class font, font-face 





c1-- file: svg-basic-font.mod 


This is SVG, a language for describing tvo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), ALL Rights Reserved. 
Revision: $1d: svg-basic-font.mod,v 1.4 2011/07/08 03:18:58 cmccorma Exp $ 





This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//M3C//ELEMENTS SVG 1.1 Basic Font//EN" 
SYSTEM "http: / /vvv.vV3.org/Graphics/SVG/1.1/DTD/svg-basic-font.mod" 


c1-- Basic Font 


font, font-face, glyph, missing-glyph, hkern, font-face-src, 
Tont-face-name 


This module declares markup to provide support for template. 


--- 
c1-- Qualified Names (Default) ......................... --- 
€IENTİTY 55 SVG.font.qname "font" s 

€ENTİTY 55 SVG.font-face.qname "font-face" s 

€ENTİTY 55 SVG.glyph.qname "glyph" s 

€lENTİTY 55 SVG.missing-glyph.qname "missing-glyph" x 
€ENTİTY 55 SVG.hkern.qname "hkern" 5 

€ENTİTY 55 SVG.font-fTace-src.qname "font-face-src" s 
€ENTİTY 55 SVG. font-face-name.qname "Tont-face-name" x 
c1-- Attribute Collections (Default) ................... --- 
€IENTİTY 55 SVG.Core.attrib "" s 

€IENTİTY $ SVG.Container.attrib "" s 

€IENTİTY $ SVG.Style.attrib "" s 

€IENTİTY $ SVG.Vievport.attrib "" 

€IENTİTY $ SVG.Text.attrib "" s 

€IENTİTY $ SVG.TextContent.attrib "" s 

€IENTİTY $ SVG.Font.attrib "" s 

€IENTİTY $ SVG.Paint.attrib "" s 

€lENTİTY 55 SVG.Color.attrib "" s 

€IENTİTY $ SVG.Üpacity.attrib "" s 

€IENTİTY $ SVG.Graphics.attrib "" s 

€lENTİTY 55 SVG.Marker.attrib "" s 

€lENTİTY $ SVG.ColorProfile.attrib "" s 

€IENTİTY $ SVG.Gradient.attrib "" 

€IENTİTY $ SVG.Clip.attrib "" s 

€IENTİTY 55 SVG.Mask.attrib "" s 

€lENTİTY $ SVG.Filter.attrib "" s 

€IENTİTY $ SVG.FilterColor.attrib "" s 

€lENTİTY 55 SVG.Cursor.attrib "" s 

€IENTİTY $ SVG.XLinkRequired.attrib "" 5 

€IENTİTY $ SVG.External.attrib "" 


sil SV: Fontuelass süz yə əə RPŞ ana bdazaas --- 


€lENTİTY 55 SVG.Font.extra. class "" s 
€ENTİTY 55 SVG.Font.class 
"1 S5SVG.font.qname, 1 S:SVG.font-face .qname, 5S:SVG.Font.extra.class," 


z 


e1-- font: Font Element ................................ --- 
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€IENTİTY 55 SVG.font.extra.content "" s 


€lENTİTY 55 SVG.font.element "INCLUDE" x 
cl İ55SVG. font.element, 1 
€lENTİTY 55 SVG.font.content 
"( S5SVG.Description.class, 1 5:SVG.font-fTace.qname , 
İ “5SVG.missing-glyph.qname, 1 555VG.glyph.qname, 1 S5SVG.hkern .qname 

35S8VG. font.extra.content, )”" 
z 
€ ELEMENT 5:SVG. font.qname, “:5VG. font.content, xs 
c1-- end of SVG.font.element --x11- 


€IENTİTY $ SVG.font.attlist "INCLUDE" x 
cl İ8SVG.font.attlist,l 
€ ATTLIST 5:SVG.font.qname, 
S5SVG.Core.attrib, 
S5SVG.Style.attrib, 
S5SVG.External.attrib, 
horiz-origin-x s:Number..datatype, £TMPLTED 
horiz-adv-x "sNumber .datatype, ““REQUTRED 





z 
c1-- end of SVG.font.attlist --s11- 


c1-- font-face: Font Face Element ...................... --5 
€ENTİTY 55 SVG.font-face.extra.content "" s 


€ENTİTY 55 SVG.font-face.element "INCLUDE" 5 
cl İS5SVG. font- face .element, 1 
€lENTİTY 55 SVG.font-fTace.content 
"( ( S5SVG. font-face-src.qname, , 
( 358VG.Description.class, S:SVG. font-face.extra.content, )” ) 
I ( ( SSVG.Description.class, 55SVG. font-face.extra.content, )H, 
95SVG. font-face-src.qname, , 
( ( $SVG.Description.class, 9:SVG. font-face.extra.content, )” )? ) )" 
- 
€ ELEMENT S:SVG. font-fTace. qname, S:SVG. font-face. content, x 
c1-- end of SVG.font-face element --s11- 


€lENTİTY $ SVG.font-face.attlist "INCLUDE" 5 

cl 8SVG.font-face.attlist,1 

€ ATTLIST S:SVG. font-fTace . qname, 
S58VG.Core.attrib, 
font-family CDATA £IMPLIED 
Tont-style CDATA £1MPLIED 
font-variant CDATA £1MPLTED 
font-veight CDATA £IMPLIED 
font-stretch CDATA £1MPLTED 
font-size CDATA £1MPLIED 
unicode- range CDATA ZTMPLIED 
units-per-em s:Number .datatype, £T1MPLTED 
panose-1 CDATA £TIMPLIED 
stemv 5:Number .datatype, 2TMPLIED 
stemh ":Number..datatype, ““TMPLIED 
slope ":Number..datatype, “TMPLİIED 
cap-height s:Number .datatype, £TMPLTED 
x-height ssNumber .datatype, £T1MPLIED 
accent-height s:Number .datatype, “2”TMPLIED 
ascent ss:Number..datatype, “TMPLIED 
descent s:Number .datatype, £TMPLTED 
vidths CDATA £IMPLIED 
bbox CDATA £TMPLTED 
ideographic "s:Number .datatype, £IMPLIED 
alphabetic ssNumber .datatype, £1MPLIED 
mathematical s:Number .datatype, “£TIMPLIED 
hanging "Number ..datatype, “FTMPLIED 
underline-position 5:Number.datatype, 2TMPLIED 
underline-thickness 5:Number .datatype, £1MPLTED 
strikethrough-position ":Number.datatype, “"TMPLIED 
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strikethrough-thickness 5:Number .datatype, “£T1MPLTED 
overline-position ?s:Number .datatype, £IMPLIED 
overline-thickness ":Number .datatype, 2”TMPLIED 

- 

c1-- end of SVG.font-face.attlist --sll- 


e1-- glyph: Glyph Element .............................. --- 
€IENTİTY 55 SVG.glyph.extra.content "" s 


€ENTİTY 55 SVG.glyph.element "IİNCLUDE" 5 
cl 158VG.glyph.element, 1 
€IENTİTY 55 SVG.glyph.content 
"( S5SVG.Description.class, 9S:SVG.glyph.extra.content, )”" 
z 
ce ELEMENT 5:SVG.glyph.qname, 555VG.glyph.content, s 
c1-- end of SVG.glyph.element --s115 


€lENTİTY $ SVG.glyph.attlist "INCLUDE" 5 
cl 158VG.glyph.attlist,l 
€ ATTLIST 5S:SVG.glyph.qname, 
S5SVG.Core.attrib, 
S58VG.Style.attrib, 
unicode CDATA £TMPLTED 
glyph-name CDATA £TMPLTIED 
d s5PathData.datatype, 2£1MPLIED 
arabic-form CDATA £T1MPLTED 
1ang “sLanguageCodes .datatype, £1MPLTED 
horiz-adv-x "sNumber .datatype, “£1MPLIED 
z 
c1-- end of SVG.glyph.attlist --s115 


c1-- missing-glyph: Missing Glyph Element .............. --- 
€IENTİTY $ SVG.missing-glyph.extra. content "" s 


€1ENTİTY $ SVG.missing-glyph.element "INCLUDE" 5 
cl (958VG.missing-glyph.element, 1 
€1ENTİTY $ SVG.missing-glyph.content 

"( SSVG.Description.class, 555VG.missing-glyph.extra.content, 
z 
€ ELEMENT 5:SVG.missing-glyph.qname, 5:5VG.missing-glyph.content, x 
c1-- end of SVG.missing-glyph.element --s115 


€1ENTİTY $ SVG.missing-glyph.attlist "INCLUDE" 5 
cl S5VG.missing-glyph.attlist,1 
€ 1ATTLIST 5:S8VG.missing-glyph.qname, 
S5SVG.Core.attrib, 
S58VG.Style.attrib, 
d ssPathData.datatype, 2£1MPLIED 
horiz-adv-x s:Number .datatype, “/IMPLIED 
z 
c1-- end of SVG.missing-glyph.attlist --s115 


c1-- hkern: Horizontal Kerning Element ................. 5 


€ENTİTY 55 SVG.hkern.element "INCLUDE" 5 

cl İS5SVG .hkern.element, 1 

€VENTİTY 55 SVG.hkern. content "EMPTY" 5 

ce ELEMENT 5:SVG.hkern.qname, 5S5SVG.hkern.content, xs 
c1-- end of SVG.hkern.element --x115 


€lENTİTY $ SVG.hkern.attlist "INCLUDE" 5 
cl İ55SVG.hkern.attlist,l 
€ ATTLIST S5SVG..hkern .qname 
S5SVG.Core.attrib, 
u1 CDATA £IMPLIED 
g1 CDATA £IMPLIED 
u2 CDATA £IMPLIED 
g2 CDATA £IMPLIED 
k ssNumber .datatype, “2REQUTRED 
z 
c1-- end of SVG.hkern.attlist --s1l1- 


c1-- font-face-src: Font Face Source Element ........... -- 


€ ENTİTY 55 SVG.font-fTace-src.extra.content "" s 


ye 


€IENTİTY 55 SVG.font-face-src.element "INCLUDE" 5 
cl İ55SVG. font-face-src.element, 1 
€ENTİTY 55 SVG.font-Tace-src.content 

"( S5SVG. font-Tace-name .qname , S55VG. font-face-src.extra.content, )4" 
- 
€ ELEMENT S:SVG. font-face-src.qname , 5S5SVG. font-face-src.content, x 
c1-- end of SVG.font-face-src.element --x11- 
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€IENTİTY $ SVG.font-face-src.attlist "INCLUDE" x 

cl İ55SVG. font-face-src.attlist,l 

€ ATTLIST S5SVG. font-face-src.qname , 
S5SVG.Core.attrib, 





z 
c1-- end of SVG.font-face-src.attlist --c11- 


c1-- font-face-name: Font Face Name Element ............ --- 


€ENTİTY 55 SVG.font-fTace-name.element "INCLUDE" 5 

cl İ55SVG. font-face-name . element, 1 

€ENTİTY 55 SVG. font-Tace-name. content "EMPTY" x 

€ ELEMENT S:SVG. font-fTace-name .qname, 5:5VG. font-face-name . content, x 
c1-- end of SVG.font-face-name . element --s115 





€lENTİTY $ SVG.font-face-name.attlist "INCLUDE" 5 
cl İ55SVG. font-face-name .attlist, 1 
€ ATTLIST S5SVG. font-fTace-name .qname, 
S5SVG.Core.attrib, 
name CDATA £TMPLTIED 
- 


c1-- end of SVG.font-face-name.attlist --s115 


xc1-- end of svg-basic-font.mod --5 


A.3.41 Extensibility Module 


"The Extensibility Module defines the Extensibility.class element collection. 


Elements in collection 
foreignObiect 





c1-- file: svg-extensibility.mod 
This is SVG, a language for describing tvo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), ALL Rights Reserved. 
Revision: $1d: svg-extensibility.mod,v 1.2 2011/07/08 03:18:58 cmccorma Exp $ 
This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//3C//ELEMENTS SVG 1.1 Extensibility//EN" 
SYSTEM "http: / /uvv.vV3.org/Graphics/SVG/1.1/DTD/svg-extensibility.mod" 


c1-- Extensibility 
foreignübfiect 


This module declares markup to provide support for extensibility. 
--- 


c1-- Qualified Names (Default) ......................... -- 
€lENTİTY 5 SVG.foreignObiect.qname "foreignübiect" x 


c1-- Attribute Collections (Default) ................... --- 
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€IENTİTY 55 SVG.Core.attrib "" s 
€lENTİTY $ SVG.Conditional.attrib "" s 
€lENTİTY $ SVG.Style.attrib "" s 
€IENTİTY $ SVG.Vievport.attrib "" s 
€IENTİTY $ SVG.Text.attrib "" s 
€IENTİTY $ SVG.TextContent.attrib "" s 
€IENTİTY $ SVG.Font.attrib "" s 
€lENTİTY $ SVG.Paint.attrib "" s 
€ENTİTY 55 SVG.Color.attrib "" s 
€lENTİTY $ SVG.Üpacity.attrib "" s 
€IENTİTY 5 SVG.Graphics.attrib "" 
€lENTİTY 55 SVG.Marker.attrib "" s 
€IENTİTY $ SVG.Gradient.attrib "" 
€IENTİTY $ SVG.Clip.attrib "" s 
€IENTİTY 55 SVG.Mask.attrib "" s 
€lENTİTY $ SVG.Filter.attrib "" s 
€lENTİTY $ SVG.FilterColor.attrib "" s 
€lENTİTY 55 SVG.GraphicalEvents.attrib "" s 
€lENTİTY 55 SVG.Cursor.attrib "" s 
€IENTİTY 5 SVG.External.attrib "" s 
€1-- SVG.Extensibility.class ........................... --- 


€IENTİTY $ SVG.Extensibility.extra.class "" s 





€IENTİTY $ SVG.Extensibility.class 
"1 S5SVG.foreignObfiect.qname, 5:5VG.Extensibility.extra.class," 
z 


e€1-- SVG.Presentation.attrib ........................... --- 
€lENTİTY $ SVG.Presentation.extra.attrib "" s 


€lENTİTY $ SVG.Presentation.attrib 
"SSVG.Container.attrib, 
358VG.Vieuvport.attrib, 
958VG.Text.attrib, 
358VG.TextContent.attrib, 
358VG.Font.attrib, 
958VG.Paint.attrib, 
558VG.Color.attrib, 
555VG.Opacity.attrib, 
358VG.Graphics.attrib, 
558VG.Marker.attrib, 
358VG.ColorProfile.attrib, 
358VG.Gradient.attrib, 
358V6.Clip.attrib, 
358VG.Mask.attrib, 
S58VG.Filter.attrib, 
S58V6.FilterColor.attrib, 
358VG.Cursor.attrib, 
T1ood-color 5:SVGColor.datatype, £TIMPLIED 
Tlood-opacity 5ss0pacityValue.datatype, £1MPLTED 
lighting-color S5SVGColor.datatype, £TMPLTED 
358VG.Presentation.extra.attrib," 

- 


c1-- foreignObiect: Foreign Obiect Element ............. --- 
€IENTİTY 55 SVG.foreignObiect.extra.content "" s 


€1ENTİTY 55 SVG.foreignObiect.element "INCLUDE" 5 
cl 158VG. foreignübiect .element, 1 
€VENTİTY 5. SVG.foreignObiect. content 
"( 2PCDATA SsSVG.TforeignObfiect.extra.content, )”" 
z 
€ ELEMENT S:SVG. foreignübiect .qname, 5S:5VG.foreignObfiect content, x 
c1-- end of SVG.foreignübiect.element --x115 


€1ENTİTY $ SVG.foreignObiect.attlist "INCLUDE" 5 
c18SVG.foreignüÜbiect.attlist,l 
€ 1ATTLIST S:SVG. foreignübiect .qname, 
S58VG.Core.attrib, 
S5SVG.Conditional.attrib, 
S5SVG.Style.attrib, 
S58VG.Presentation.attrib, 
S58VG.GraphicalEvents.attrib, 
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S5SVG.External.attrib, 

x 55Coordinate.datatype, £TIMPLTED 

y 5:Coordinate.datatype, £TIMPLTED 

vidth "sLength.datatype, 2£REQUTRED 

height s:Length.datatype, “£REQUTRED 

transform 5:TransformList.datatype, £1MPLTED 
z 


c1-- end of SVG.foreignÜbfiect.attlist --s115 


c1-- end of svg-extensibility.mod --x 


A.4 SVC 1.1 Document Type Definition 


A.4.1 SVG 1.1DTD Driver 


"This section contains the DTD driver for the SVG 1.1 document type implementation as an XML DTD. tt relies 
upon SVG 1.1 module implementations defined in Section A.3. 


2604075555...” --5 
elo SVu.l.-l DİD: sə əv sa zl bb day xaşa Ps barpaaıys as ou YO saa apa musdboy --- 
c1-- file: svg11.dtd 

-- 


c1-- SVG 1.1 DTD 
This is SVG, a language for describing tvo-dimensional graphics in XML. 


The Scalable Vector Graphics (SVG) 

Copyright 2001, 2002, 2011 Morld Mide Meb Consortium 
(Massachusetts Institute of Technology, Institut National de 
Recherche en Informatique et en Automatique, Keio University). 
ALI Rights Reserved. 


Permission to use, copy, modify and distribute the SVG DTD and its 
accompanying documentation for any purpose and vithout fee is hereby 
granted in perpetuity, provided that the above copyright notice and 
this paragraph appear in all copies. The copyright holders make no 
representation about the suitability of the DTD for any purpose. 


It is provided "as is" vithout expressed or implied varranty. 


Author: 2un Fufisava cfuflisava. Tungcanon .co.1p” 
Revision: $1d: svg11.dtd,v 1.2 2011/07/08 03:19:00 cmccorma Exp $ 


--- 
c€1-- This is the driver file for version 1.1 of the SVG DTD. 


This DTD is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//3C//DTD SVG 1.1//EN" 
SYSTEM "http: / /vvv/.vV3.org/Graphics/SVG/1.1/DTD/svg11.dtd" 
--- 


€IENTİTY 55 SVG.version "-//3C//DTD SVG 1.1//EN" xs 
c1-- Use this URI to identify the default namespace: 
"http:/ /uvv/.v3.org/2000/svg" 
See the Qualified Names module for information 
on the use of namespace prefixes in the DTD. 
--- 
€lENTİTY 55 NS.prefixed "IGNORE" 5 
€IENTİTY 5 SVG.prefix ""s 


c1-- reserved for future use vith document profiles --s 
€lENTİTY 55 SVG.profile "" s 
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€ ENTİTY 55 svg-prefv- redecl.module "TİGNORE" 5 
cl İSssvg-prefTv/- redecl.module, 1 
5ssvg -prefv/- redecl.mod? 115 


c1-- Document Model Module ....................................... --- 
€IENTİTY 55 svg-model.mod 
PUBLIC "-//3C//ENTITIES SVG 1.1 Document Mode1//EN" 
"svg11-model.mod" 5 


c1-- Attribute Collection Module ................................. --- 
€1ENTITY $ svg-attribs.mod 
PUBLIC "-//3C//ENTITIES SVG 1.1 Attribute Collection//EN" 
"svgll-attribs.mod" 5 


x1-- Modular Framevvork Module .................................... --- 
€ ENTİTY 55 svg-framevork.module "İNCLUDE" 5 
cl 1Sssvg -Tramevork.module, 1 
€ VENTİTY 55 svg-framevvork.mod 
PUBLIC "-//3C//ENTITIES SVG 1.1 Modular Framevork//EN" 
"svg-Tramevork.mod" 5 
55svg - framevork.mod, 115 


c1-- Post-Framevork Redeclaration Placeholder .................... --- 
€ENTİTY 55 svg-postfv- redecl.module "İGNORE" 5 

cl 15ssvg--postfv- redecl.moduTe 1 

55sVg -postfv- redecl.mod, 11” 


e1-- Core Attribute Module ....................................... --- 
€lENTİTY $ svg-core-attrib.module "INCLUDE" 5 
cl İ6svg-core-attrib.module, 1 
€lENTİTY $ svg-core-attrib.mod 
PUBLIC "-//3C//ENTITIES SVG 1.1 Core Attribute//EN" 
"svg-core-attrib.mod" x 
Sssvg-core-attrib.mod, 11” 


e1-- Container Attribute Module .................................. --- 
€IENTİTY $ svg-container-attrib.module "INCLUDE" 5 
cl 9ssvg-container-attrib .module, 1 
€lENTİTY $ svg-container-attrib.mod 
PUBLIC "-//M3C//ENTITIES SVG 1.1 Container Attribute//EN" 
"svg-container-attrib.mod" 5 
Sssvg-container-attrib .mod, 115 


c€1-- Vieuport Attribute Module ................................... --5 
€lENTİTY $ svg-vievport-attrib.module "INCLUDE" 5 
cl İSssvg-vieuport-attrib.module, 1 
€lENTİTY $ svg-vievport-attrib.mod 
PUBLIC "-//3C//ENTITIES SVG 1.1 Vievport Attribute//EN" 
"svg-vieuport-attrib.mod" 5 
Sssvg-Vieuvport-attrib.mod, 11” 


e1-- Paint Attribute Module ...................................... --- 
€lENTİTY $ svg-paint-attrib.module "INCLUDE" 5 
cl 9svg-paint-attrib.module, 1 
€1ENTITY $ svg-paint-attrib.mod 
PUBLIC "-//M3C//ENTITIES SVG 1.1 Paint Attribute//EN" 
"svg-paint-attrib.mod" x 
9ssvg-paint-attrib.mod, 115 





c€1-- Paint Üpacity Attribute Module .............................. --5 
€IENTİTY $ svg-opacity-attrib.module "INCLUDE" xs 
cl 19ssvg-opacity-attrib.module, 1 
€1ENTITY $ svg-opacity-attrib.mod 
PUBLIC "-//M3C//ENTITIES SVG 1.1 Paint Üpacity Attribute//EN" 
"svg-opacity-attrib.mod" x 
Sssvg-opacity-attrib.mod, 115 


c€1-- Graphics Attribute Module ................................... --5 
€IENTİTY $ svg-graphics-attrib.module "INCLUDE" x 
cl 1Sssvg-graphics-attrib.module, 1 
€lENTİTY $ svg-graphics-attrib.mod 
PUBLIC "-//M3C//ENTITIES SVG 1.1 Graphics Attribute//EN" 
"svg-graphics-attrib.mod" x 
9ssvg-graphics-attrib.mod, 11” 
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c1-- Document Events Attribute Module ............................ --- 
€lENTİTY 5 svg-docevents-attrib.module "INCLUDE" 5 
cl 196svg-docevents-attrib .module, 1 
€IENTİTY 55 svg-docevents-attrib.mod 
PUBLIC "-//M3C//ENTITIES SVG 1.1 Document Events Attribute//EN" 
"svg-docevents-attrib.mod" 5 
5ssvg-docevents-attrib .mod, 115 


c1-- Graphical Element Events Attribute Module ................... --5 
€lENTİTY 55 svg-graphevents-attrib.module "INCLUDE" 5 
cl İsesvg-graphevents-attrib.module, 1 
€lENTİTY 55 svg-graphevents-attrib.mod 
PUBLIC "-//3C//ENTITIES SVG 1.1 Graphical Element Events Attribute//EN" 
"svg-graphevents-attrib.mod" x 
55sVg-graphevents-attrib.mod, 115 


c1-- Animation Events Attribute Module ........................... --- 
€IENTİTY $ svg-animevents-attrib.module "INCLUDE" 5 
cl Sssvg-animevents-attrib.module, İ 
€lENTİTY $ svg-animevents-attrib.mod 
PUBLIC "-//M3C//ENTITIES SVG 1.1 Animation Events Attribute//EN" 
"svg-animevents-attrib.mod" 5 
9ssvg-animevents-attrib.mod, 11” 


e1-- XLink Attribute Module ...................................... --- 
€lENTİTY $ svg-xlink-attrib.module "INCLUDE 
clİSsvg-xlink-attrib.module, 1 
€1ENTITY $ svg-xlink-attrib.mod 
PUBLIC "-//3C//ENTITIES SVG 1.1 XLink Attribute//EN" 
"svg-xlink-attrib.mod" x 
$ssvg-xlink-attrib.mod, 115 





c1-- External Resources Attribute Module ......................... --- 
€lENTİTY $ svg-extresources-attrib.module "INCLUDE" 5 
cl İS6svg-extresources-attrib.module, 1 
€IENTİTY $ svg-extresources-attrib.mod 
PUBLIC "-//3C//ENTITIES SVG 1.1 External Resources Attribute//EN" 
"svg-extresources-attrib.mod" 5 
5ssvg-extresources-attrib.mod,: 115 


vil “Strüctüre: Modülle:..i ii sə sopa dyasəğ YasDbs Rzalı a Yi --- 
€1ENTİTY 55 svg-structure.module "İNCLUDE" 5 
cl İSssvg-structure .module, 1 
€1ENTITY $ svg-structure.mod 
PUBLIC "-//3C/ /ELEMENTS SVG 1.1 Structure//EN" 
"svg-structure.mod" 5 
5ssvg-structure.mod, 115 


€1-- Conditional Processing Module ............................... --5 
€IENTİTY $ svg-conditional.module "İNCLUDE" 5 
cl 166svg-conditional .module, 1 
€lENTİTY $ svg-conditional.mod 
PUBLIC "-//3C//ELEMENTS SVG 1.1 Conditional Processing/ /EN" 
"svg-conditional.mod" 5 
5esvg-conditional.mod, 11” 


gil “1mağe-Module sis yü ys sələ soıkala aa SRƏLSR Yaya Yüzbalm bad Masya --- 
€1ENTİTY 55 svg-image.module "İNCLUDE" 5 
cl İ6svg-image .module, 1 
€lENTİTY 5 svg-image.mod 
PUBLIC "-//3C//ELEMENTS SVG 1.1 Image//EN" 
"svg-image.mod" s 
5esvg- image .mod, 115 


el-- Style: Module: :. əy size dz şısuzıR a Ra x UĞ Şoka bum SSR sə --5 
€IENTİTY 55 svg-style.module "INCLUDE" x 
cl İSssvg-style.module, 1 
€VENTİTY 55 svg-style.mod 
PUBLIC "-//3C//ELEMENTS SVG 1.1 Style//EN" 
"svg-style.mod" s 
Sssvg-style.mod, 115 


el--— Shape: Mödüle: is ə yz suyum daşıyla Ria R RORRUR R ROYULR Şkasum BAE SURƏ ə --5 
€ENTİTY 55 svg-shape.module "İNCLUDE" x 
cl 1Sssvg-shape .module, 1 
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€ ENTİTY 55 svg-shape.mod 
PUBLIC "-//3C/ /ELEMENTS SVG 1.1 Shape//EN" 
"svg-shape.mod" s 
5ssvg-shape.mod, 115 


şilze Text Mödüle: səsə YY Şuşa BŞ RYDRR RUR PYD 9 --5 
€IENTİTY 55 svg-text.module "İNCLUDE" 5 
cl İSssvg-text.module, 1 
€lENTİTY 55 svg-text.mod 
PUBLIC "-//3C//ELEMENTS SVG 1.1 Text//EN" 
"svg-text.mod" xs 
5ssvg-text.mod, 11” 


giz Marker Module sə da səna a sz aydaa SƏY Rei yə --5 
€ENTİTY 55 svg-marker..module "İNCLUDE" 5 
cl İSssvg-marker .module 1 
€ENTİTY 55 svg-marker..mod 
PUBLIC "-//3C///ELEMENTS SVG 1.1 Marker//EN" 
"svg-marker.mod" s 
5ssvg -marker .mod, 115 


e1-- Color Profile Module ........v.əüU.əya əsə aa ssas əsədəsə --- 
€lENTİTY 5 svg-profile.module "İNCLUDE" x 
cl İSesvg-profile.module, 1 
€1ENTIİTY 55 svg-profile.mod 
PUBLIC "-//3C//ELEMENTS SVG 1.1 Color Profile//EN" 
"svg-profile.mod" 5 
Sssvg-profile.mod, 11” 


sız iGradient Modulle: .s.uə əəə paz oya aş R RLƏyR Aza ZY əmə ayə --- 
€lENTİTY 5 svg-gradient.module "İNCLUDE" 5 
cl İsesvg-gradient .module, 1 
€lENTİTY 55 svg-gradient.mod 
PUBLIC "-//3C//ELEMENTS SVG 1.1 Gradient//EN" 
"svg-gradient.mod" s 
5ssvg-gradient.mod, 115 


silzc Pattern Mödute sələ amaya SURRA PŞrARa ƏŞ R 9 --5 
€lENTİTY 55 svg-pattern.module "İNCLUDE" x 
cl İSssvg-pattern.module, 1 
€IENTİTY 55 svg-pattern.mod 
PUBLIC "-//3C/ /ELEMENTS SVG 1.1 Pattern/ /EN" 
"svg-pattern.mod" 5 
5ssvg-pattern.mod, 115 


şilz €lip:Modüleə aşa aa R LmD LEY bERƏBŞ RYe R 0) --5 
€lENTİTY $ svg-clip.module "İNCLUDE" 5 
cl 16svg-clip.module, 1 
€IENTİTY $ svg-clip.mod 
PUBLIC "-//3C//ELEMENTS SVG 1.1 Clip//EN" 
"svg-clip.mod" 5 
5ssvg-clip.mod, 115 


şeılzə Mask-Modüle: sə səy pak BTB sy eyy ƏŞ edə --5 
€ENTİTY 55 svg-mask.module "İNCLUDE" 5 
cl İSssvg-mask .module, 1 
€1ENTİTY 55 svg-mask.mod 
PUBLIC "-//3C/ /ELEMENTS SVG 1.1 Mask//EN" 
"svg-mask.mod" xs 
5ssvg -mask.mod, 115 


şilzo FiVter"Module: sə a əyal sa sz pyydzaı BY Re 9 --5 
€lENTİTY 5 svg-filter.module "İNCLUDE" 5 
cl İSssvg-filter ..module, 1 
€lENTİTY $ svg-filter.mod 
PUBLIC "-//3C//ELEMENTS SVG 1.1 Filter//EN" 
"svg-filter.mod" 5 
Sssvg-filter.mod, 11” 


gılz— Cürsor-Modulme: sə am sas R sU PŞRR RƏY R də --- 
€lENTİTY 55 svg-cursor.module "İNCLUDE" 5 
el İSssvg-cursor.module, 1 
€ENTİTY 55 svg-cursor.mod 
PUBLIC "-//3C/ /ELEMENTS SVG 1.1 Cursor//EN" 
"svg-cursor.mod" xs 
5ssvg-cursor.mod, 115 


e1-- Hyperlinking Module ......................................... --5 
€lENTİTY 5 svg-hyperlink.module "İNCLUDE" 5 
cl İesvg-hyperlink.module, 1 
€lENTİTY 55 svg-hyperlink.mod 
PUBLIC "-//3C//ELEMENTS SVG 1.1 Hyperlinking//EN" 
"svg-hyperlink.mod" x 
5ssvg-hyperlink.mod, 115 


c 
.Ə 
5 
İv) 
m") 
(s 
(3) 
E 
E 
ə) 
(ə) 
(3 
ad 
. 
s 


sılz- Vaev: Module a za baza so dl a depo dua maq Bab a do RASL RRR bə --- 
€IENTİTY 55 svg-viev..module "İNCLUDE" 5 
cl İSssvg-viev.module, 1 
€1ENTİTY 55 svg-viev.mod 
PUBLIC "-//3C//ELEMENTS SVG 1.1 Viev//EN" 
"svg-viev.mod" x 
55sVg-Viev.mod, 11” 


e€l-- Seripting Modülte: : ziy qodu b R RaaoR x YORAR RİR KUR SGS RMA Vd Şə --5 
€lENTİTY $ svg-script.module "İNCLUDE" 5 
cl İ6svg-script.module, 1 
€IENTİTY $ svg-script.mod 
PUBLIC "-//M3C//ELEMENTS SVG 1.1 Scripting//EN" 
"svg-script.mod" xs 
5ssvg-script.mod, 11” 





cı-- Animation Modüle:-- vu ə san aa dala ŞUR Razı daa Bı bala RRRLƏ Ə --- 
€IENTİTY $ svg-animation.module "İNCLUDE" 5 
cl 166svg-animation .module, 1 
€1ENTITY $ svg-animation.mod 
PUBLIC "-//3C//ELEMENTS SVG 1.1 Animation//EN" 
"svg-animation.mod" 5 
5esvg-animation.mod, 115 


sıls— Font: Module l.ə yı bzi solda a desaoaırbpdoRə Rado doğ PAS Re AD bə --- 
€VENTİTY 55 svg-font.module "İNCLUDE" 5 
cl 1Sssvg-font.module, 1 
€IENTİTY 55 svg-font.mod 
PUBLIC "-//3C//ELEMENTS SVG 1.1 Font//EN" 
"svg-font.mod" xs 
5ssvg- font.mod, 115 


c€1-- Extensibility Module ........................................ --5 
€lENTİTY $ svg-extensibility.module "INCLUDE" x 
cl İSssvg-extensibility .module, 1 
€1ENTITY $ svg-extensibility.mod 
PUBLIC "-//3C//ELEMENTS SVG 1.1 Extensibility//EN" 
"svg-extensibility.mod" 5 
Sssvg-extensibility.mod, 11” 


cl-- 


A.4.2 SVG 1.1 Document Model 


A SVG Family Document Type (such as SVG 1.1) must define the content model that it uses. This is done through 
a separate content model module that is instantiated by the SVG Modular Framevvork. The content model module 
and the SVG 1.1 DTD Driver (above) vvork together to customize the module implementations to the document 
type s specific requirements. The content model module for SVG 1.1 is defined belovv: 


1050077 77.” --- 
c€1-- SVG 1.1 Document Model Module ......................................... 1-5 
c1-- file: svgl1-model.mod 


This is SVG, a language for describing tvo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), ATLI Rights Reserved. 
Revision: $1d: svg11-model.mod,v 1.2 2011/07/08 03:18:59 cmccorma Exp $ 
This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//3C//ENTITIES SVG 1.1 Document Mode1//EN" 
SYSTEM "http: / /vuv/.vV3.org/Graphics/SVG/1.1/DTD/svg11-model1l.mod" 
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c1-- SVG 1.1 Document Model 


This module describes the groupings of elements that make up 
common content models for SVG elements. 
--- 


c1-- module: svg-structure.mod ......................... --5 


€lENTİTY 55 SVG.Description.extra.class "" s 

€lENTİTY $ SVG.Description.class 
"S5SVG.desc.qname, 1 S58VG.title.qname, 1 S5SVG.metadata .qname, 
3558VG.Description.extra.class," 

z 


€ VENTİTY 5. SVG.Use.extra.class "" s 
€ VENTİTY 5. SVG.Use.class 

"1 SSVG.use .qname, S:SVG.Use.extra.class," 
z 


€lENTİTY 55 SVG.Structure.extra.class "" 
€lENTİTY 55 SVG.Structure.class 


"1 S5SVG.svg .qname, 1 555VG.g.qname, 1 S5SVG.defs.qname, 1 S:SVG. symbol.qname , 


35SVG .Use. class, S5SVG.Structure.extra.class," 
z 


c1-- module: svg-conditional.mod ....................... ə 
€lENTİTY $ SVG.Conditional.extra.class "" s 
€lENTİTY $ SVG.Conditional.class 


"1 SSVG.svitch.qname, S:SVG.Conditional.extra.class," 
z 


c1-- module: svg-image.mod 





€1ENTİTY $. SVG.lmage.extra.class "" 5 
€VENTİTY 5. SVG.lmage.class 

"1 S5SVG.image .qname, 5:5VG. mage.extra.class," 
z 


c1-- module: svg-style.mod ............................. --5 


€ENTİTY 55 SVG.Style.extra.class "" s 
€ENTİTY 55 SVG.Style.class 

"1 S5SVG.style.qname, 5:5VG.Style.extra.class," 
z 


c1-- module: svg-shape.mod ............................. --- 


€ENTİTY 55 SVG.Shape.extra.class "" s 
€ENTİTY 55 SVG.Shape. class 
"1 S5SVG.path.qname, 1 S:SVG. rect..qname, 1 S5SVG.circle.qname, 
İ “5SVG.line.qname, 1 S5SVG.ellipse.qname, 1 S55VG.polyline. qname, 
İ “5SVG.polygon.qname, 5S55VG.Shape.extra.class," 
- 


c1-- module: svg-text.mod .............................. --5 


€IENTİTY 55 SVG.Text.extra. class "" s 
€lENTİTY 55 SVG.Text.class 

"1 S5SVG.text.qname, 1 S55VG.altGlyphDef .qname, 5:SVG.Text.extra.class," 
z 


€1ENTİTY 55 SVG.TextContent .extra.class "" s 
€lENTİTY 55 SVG.TextContent.class 
"1 S5S8VG.tspan.qname, 1 S5SVG.tref..qname, 1 S5SVG.textPath.qname , 
İ “5SVG.altGlyph .qname, “:5VG.TextContent .extra.class," 
z 


c1-- module: svg-marker.mod ............................ --5 





€ VENTİTY 5. SVG.Marker.extra.class "" s 
€ VENTİTY 5. SVG.Marker.class 

"1 “SVG.marker .qname, 5S:SVG.Marker.extra.class," 
z 


c 
.Ə 
5 
İv) 
m") 
(s 
(3) 
z 
E 
ə) 
(ə) 
o 
ad 
. 
s 





c1-- module: svg-profile.mod ........................... --- 


€lENTİTY 55 SVG.ColorProfile.extra.class "" s 
€ENTİTY 55 SVG.ColorProfile.class 

"1 S5SVG.color-profile.qname, S:5VG.ColorProfile.extra.class," 
z 


c1-- module: svg-gradient.mod .......................... --5 


€lENTİTY 55 SVG.Gradient.extra.class "" s 
€lENTİTY 55 SVG.Gradient.class 
"1 S5SVG.linearGradient .qname, 1 S5SVG.radialGradient.qname, 
358VG.Gradient.extra.class," 
- 


c1-- module: svg-pattern.mod ........................... --- 


€1ENTİTY 55 SVG.Pattern.extra.class "" s 
€lENTİTY 55 SVG.Pattern.class 

"1 S5SVG.pattern.qname, 5S:5VG.Pattern.extra.class, " 
z 


c1-- module: svg-clip.mod .............................. --- 


€IENTİTY 55 SVG.Clip.extra. class "" s 
€IENTİTY $ SVG.Clip.class 

"1 S5SVG.clipPath.qname, 5:5VG.Clip.extra.class," 
- 


c1-- module: svg-mask.mod .............................. --5 


€ VENTİTY 5. SVG.Mask.extra.class "" s 
€ VENTİTY 5. SVG.Mask.class 

"1 S5SVG.mask.qname, 5:SVG.Mask.extra.class," 
z 


c1-- module: svg-filter.mod ............................ --5 


€IENTİTY $ SVG.Filter.extra.class "" s 

€lENTİTY 55 SVG.Filter.class 

"1 SSVG.filter.qname, S58VG.Filter.extra.class," 
z 


€IENTİTY $ SVG.FilterPrimitive.extra.class "" s 

€lENTİTY $ SVG.FilterPrimitive.class 

"1 S5SVG.feBlend.qname, 1 5:SVG. feColorMatrix.qname , 

555VG. feComponentTransfer.qname, 1 5:5VG. feComposite .qname, 
555VG. feConvolveMatrix.qname, 1 5:SVG.feDiffuseLighting .qname, 
555VG.feDisplacementMap.qname, 1 5:5SVG. feFlood.qname, 


555VG. feMorpholooy .qname, 1 “:SVG. fe0ffset.qname, 
55SVG.feSpecularLighting .qname, 1 S:SVG.feTile.qname, 
35SVG.TfeTurbulence.qname, 5$58VG.FilterPrimitive.extra.class," 





- 
c1-- module: svg-cursor.mod ............................ --5 


€IENTİTY 55 SVG.Cursor.extra. class "" s 
€ENTİTY 55 SVG.Cursor.class 

"1 S5SVG.cursor.qname, S5SVG.Cursor.extra.class, " 
z 


c1-- module: svg-hyperlink.mod ......................... --5 


€lENTİTY 55 SVG.Hyperlink.extra.class "" 
€lENTİTY 55 SVG.Hyperlink.class 

"1 S5SVG.a.qname, 555VG.Hyperlink.extra.class," 
- 


c1-- module: svg-viev.mod .............................. --- 
€ENTİTY 55 SVG.Viev.extra. class "" s 
€ENTİTY 55 SVG.Viev. class 


"1 SSVG.viev.qname, 55SVG.Viev.extra.class," 
- 


c1-- module: svg-script.mod ............................ --5 


555VG. feGaussianBlur .qname, 1 5:SVG. felmage .qname , 1 S5SVG. feMerge .qname, 
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€IENTİTY $ SVG.Script.extra.class "" s 
€IENTİTY $ SVG.Script.class 

"1 S5SVG.script.qname, S55VG.Script.extra.class," 
z 


c1-- module: svg-animation.mod ......................... --5 


€lENTİTY $ SVG.Animation.extra.class "" 

€lENTİTY $ SVG.Animation.class 
"S5SVG.animate .qname, 1 5S:SVG.set.qname, 1 S55VG.animateMotion.qname, 1 
555VG.animateColor .qname, 1 5S:SVG.animateTransform.qname, 
555VG.Animation.extra.class," 

z 


c1-- module: svg-font.mod .............................. --- 
€ENTİTY 55 SVG.Font.extra. class "" s 
€lENTİTY 55 SVG.Font.class 


"1 S5S8VG.font.qname, 1 S5SVG. font-face .qname, 5S5SVG.Font.extra.class," 
z 


c1-- module: svg-extensibility.mod ..................... -- 
€IENTİTY $ SVG.Extensibility.extra.class "" s 
€IENTİTY $ SVG.Extensibility.class 

"1 “5VG.foreignObfect.qname, 555VG.Extensibility.extra.class," 


z 


c1-- end of svg11-model.mod --5 


A.4.3 SVG 1.1 Attribute Collection 


"This section contains the attribute collection for SVG 1.1. The attribute collection module and the SVG 1.1 DTD 
Driver vvork together to customize the module implementations to the document type"s specific requirements. 


sla da ə Də əə əəə Də 0 pəs --- 
€1-- SVG 1.1 Attribute Collection Module ................................... --5 
c1-- file: svgll-attribs.mod 


This is SVG, a language for describing tvo-dimensional graphics in XML. 
Copyright 2001, 2002, 2011 M3C (MIT, INRIA, Keio), ATLI Rights Reserved. 
Revision: $I1d: svgll-attribs.mod,v 1.2 2011/07/08 03:18:59 cmccorma Exp $ 
This DTD module is identified by the PUBLIC and SYSTEM identifiers: 


PUBLIC "-//MN3C//ENTITIES SVG 1.1 Attribute Collection//EN" 
SYSTEM "http: / /uvv .v/3..org/Graphics/SVG/1.1/DTD/svg11-attribs.mod" 


c1-- SVG 1.1 Attribute Collection 


This module defines the set of common attributes that can be present 
on many SVG elements. 


--- 
c1-- module: svg-conditional.mod ....................... 5 
€IENTİTY $ ExtensionList.datatype "CDATA" 5 

€lENTİTY $ FeatureList.datatype "CDATA" x 


€lENTİTY $ SVG.Conditional.extra.attrib "" s 

€lENTİTY $ SVG.Conditional.attrib 
"requiredFeatures "sFeatureList.datatype, £IMPLTED 
requiredExtensions $5ExtensionList.datatype, £1MPLIED 
systemLanguage "sLanguageCodes .datatype, “£TIMPLTIED 
358VG.Conditional.extra.attrib," 

z 


xc1-- module: svg-style.mod ............................. 1-5 


€IENTİTY $ ClassList.datatype "CDATA" x 
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€lENTİTY $ StyleSheet.datatype "CDATA" 5 


€IENTİTY $ SVG.Style.extra.attrib "" s 
€VENTİTY $ SVG.Style.attrib 
"style SsStyleSheet .datatype, £IMPLIED 
class $sClassList.datatype, £IMPLIED 
358VG.Style.extra.attrib," 


z 

c1-- module: svg-text.mod .............................. --- 
€1ENTITY $ BaselineShiftValue.datatype "CDATA" x 

€ VENTİTY FontFamilyValue.datatype "CDATA" 5 

€ VENTİTY FontSizeValue.datatype "CDATA" x 


5 
5 
€1ENTITY $ FontSizeAdiustValue.datatype "CDATA" x 

€1ENTITY $ GlyphOrientationHorizontalValue .datatype "CDATA" 5 
€lENTİTY $ GlyphOrientationVerticalValue.datatype "CDATA" 5 
€lENTİTY 55 KerningValue.datatype "CDATA" 5 

€1ENTİTY $ SpacingValue.datatype "CDATA" 5 

€lENTİTY 55 TextDecorationValue.datatype "CDATA" x 


€lENTİTY $ SVG.Text.extra.attrib "" s 

€IENTİTY 55 SVG.Text.attrib 
"vriting-mode ( 1r-tb 1 rl-tb 1 tb-r1 1 lr I rl 1 tb 1 inherit ) £IMPLIED 
S5SVG.Text.extra.attrib," 

z 


€lENTİTY 55 SVG.TextContent.extra.attrib "" s 
€lENTİTY $ SVG.TextContent.attrib 
"alignment-baseline ( auto 1 baseline 1 before-edge Il text-before-edge 1 
middle I central 1 after-edge / text-after-edge 1 
ideographic Il alphabetic 1 hanging 1 mathematical 1 
inherit ) £IMPLIED 
baseline-shift sBaselineShiftValue.datatype, £IMPLIED 
direction ( ltr I rtl /I inherit ) £IMPLIED 
dominant-baseline ( auto İ use-script İl no-change 1 reset-size 1 
ideographic Il alphabetic 1 hanging 1 mathematical 1 
central / middle I text-after-edge 1 text-before-edge 1 
inherit ) £IMPLIED 
glyph-orientation-horizontal ss61yphOrientationHorizontalValue .datatype, 
S£IMPLIED 
glyph-orientation-vertical $GlyphürientationVerticalValue .datatype, 
PIMPLIED 
kerning ?:KerningValue .datatype, £T1MPLTED 
letter-spacing 5:SpacingValue .datatype, 2TMPLIED 
text-anchor ( start /I middle Il end I inherit ) £FIMPLIED 
text-decoration $5TextDecorationValue.datatype, 2£IMPLIED 
unicode-bidi ( normal / embed 1 bidi-override 1 inherit ) £FIMPLIED 
vvord-spacing $:SpacingValue.datatype, £1MPLIED 
S5SVG.TextContent.extra.attrib," 





z 


€1ENTİTY $ SVG.Font.extra.attrib "" 5 
S€IENTITY $ SVG.Font.attrib 
"font-family ssFontFamilyValue.datatype, “£IMPLIED 
font-size S5FontSizeValue.datatype, £1MPLIED 
font-size-adiust sFontSizeAdiustValue.datatype, £IMPLIED 
font-stretch ( normal 1 vider İ narrover / ultra-condensed 1 
extra-condensed 1 condensed 1 semi-condensed 1 
semi-expanded / expanded İl extra-expanded 1 
ultra-expanded 1 inherit ) £IMPLIED 
font-style ( normal / italic I oblique /I inherit ) £IMPLIED 
font-variant ( normal / small-caps I inherit ) FIMPLIED 
font-veight ( normal 1 bold 1 bolder 1 lighter 1 100 1 200 1 300 İ 400 1 
500 1 600 1 700 1 800 1 900 I inherit ) £IMPLIED 
Ss5SVG.Font.extra.attrib," 





z 
c1-- module: svg-marker.mod ............................ --- 
€ENTİTY 55 MarkerValue.datatype "CDATA" x 


€IENTİTY $ SVG.Marker.extra.attrib "" 

€lENTİTY 55 SVG.Marker.attrib 
"marker-start 33MarkerValue.datatype, £IMPLIED 
marker-mid ssMarkerValue.datatype, 21MPLTED 
marker-end ssMarkerValue.datatype, 2”1MPLTED 


558VG.Marker.extra.attrib," 
z 


c1-- module: svg-profile.mod ........................... --5 


€IENTİTY $ SVG.ColorProfile.extra.attrib "" s 

€lENTİTY $ SVG.ColorProfile.attrib 
"color-profile CDATA £FTMPLIED 
358VG.ColorProfile.extra.attrib," 
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z 
c1-- module: svg-gradient.mod .......................... --5 
€VENTİTY 55 NumberOrPercentage.datatype "CDATA" 5 


€lENTİTY $ SVG.Gradient.extra.attrib "" s 

€lENTİTY $ SVG.Gradient.attrib 
"stop-color s:SVGColor .datatype, 2”IMPLIED 
stop-opacity “s0pacityValue.datatype, “IMPLIED 
358VG.Gradient.extra.attrib," 

z 


c1-- module: svg-clip.mod .............................. --5 





€IENTİTY $ ClipPathValue.datatype "CDATA" 5 


€IENTİTY $ SVG.Clip.extra.attrib "" s 

€IENTİTY $ SVG.Clip.attrib 
"clip-path SClipPathValue.datatype, “IMPLIED 
clip-rule sClipFillRule.datatype, “£TIMPLIED 
358VG.Clip.extra.attrib," 

z 


c1-- module: svg-mask.mod .............................. --- 
€ENTİTY 55 MaskValue.datatype "CDATA" x 


€IENTİTY $ SVG.Mask.extra.attrib "" 
€lENTİTY $ SVG.Mask.attrib 
"mask s:MaskValue .datatype, £T1MPLIED 
358VG.Mask.extra.attrib," 
z 


c1-- module: svg-filter.mod ............................ --- 


€lENTİTY $ FilterValue.datatype "CDATA" x 
€1ENTİTY 55 NumberOptionalNumber .datatype "CDATA" 5 


€IENTİTY $ SVG.Filter.extra.attrib "" 
€lENTİTY $ SVG.Filter.attrib 
"filter sFilterValue.datatype, £1MPLIED 
35V6.Filter.extra.attrib," 
z 


€lENTİTY $ SVG.FilterColor.extra.attrib "" s 
€lENTİTY $ SVG.FilterColor.attrib 
"color-interpolation-filters ( auto 1/1 sRGB / linearRGB 1 inherit ) 
Y£IMPLIED 
358VG.FilterColor.extra.attrib," 
z 


c1-- module: svg-cursor.mod ............................ --- 
€lENTİTY 55 CursorValue.datatype "CDATA" 5 
€lENTİTY $ SVG.Cursor.extra.attrib "" s 
€lENTİTY $ SVG.Cursor.attrib 
"cursor ssCursorValue.datatype, £1MPLIED 


358VG.Cursor.extra.attrib," 
- 


c1-- end of svgll-attribs.mod --x 


Appendix B: SVG Document Obiect Model (DOM) 


Contents 
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This appendix is normative. 


B.1 SVC DOM overvlevv 


"This appendix provides an introduction to the SVG DOM and discusses the relationship of the SVG DOM vvrith 
the Document Obiect Model (DOM) Level 2 Core Specification İDOMA2l. The specific SVG DOM interfaces that 
correspond to particular sections of the SVG specification are defined at the end of corresponding chapters in this 
specification, as follovvs: 


e Basic DOM interfaces 

e Styling interfaces 

e Document Structure interfaces 

e Coordinate Systems, Transformations and Units interfaces 
e Paths interfaces 

e Basic Shapes interfaces 

e Text interfaces 

e Painting: Filling, Stroking and Marker Symbols interfaces 
e Color interfaces 

ə Gradients and Patterns interfaces 

e Clipping, Masking and Compositing interfaces 

e Filter Effects interfaces 
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e İnteractivity interfaces 
e Linking interfaces 

e Seripting interfaces 

e Animation interfaces 

e Fonts interfaces 

ə Metadata interfaces 

e Extensibility interfaces 


The SVG DOM builds upon and is compatible vvith DOM Level 2. Hn particular: 


e The SVG DOM reqvires complete support for DOM Level 2 Core İDOM2) 

e VVherever appropriate, the SVG DOM is modeled after and maintains consistencey vvith the Document Obiect 
Model HTML (İDOM11), chapter 2). 

e "he SVG DOM reqvires complete support for DOM Level 2 Vievvs İDOM2VTEVVS). 

e The SVG DOM requires support for relevant aspects of DOM Level 2 Events İDOM2EVENTSİ. (For the spe- 
cific features from DOM 2 Events that are required, see see Relationship vvith DOM Level 2 Events.) 

e For implementations that support CSS, the SVG DOM requires complete support for DOM Level 2 Style 
Sheets (İDOM2STYLE), chapter 1) and relevant aspects of DOM Level 2 CSS (İDOM2STYLE), chapter 2). (For 
the specific features from DOM 2 CSS that are required, see Relationship vvith DOM Level 2 CSS.) 


A DOM application can use the hasFeature method of the DOMlmplementation interface to verify that the inter- 
faces listed in this section are supported. The list of available interfaces is provided in section Feature strings for 
the hasFeature method call, 

AİI SVG DOM obiects that directly correspond to an attribute, e.g. the SVGAnimatedLength ry in an 
SVGRectElement, are live. This means that any changes made to the attribute are immediately reflected in the cor- 
responding SVG DOM obiect. 


B.1.1 SVG DOM obiect initialization 


The SVG DOM allovvs attributes to be accessed even though they haven" been specifted explicitly in the document 
markup. VVhen this happens an appropriate obiect is created, initialized and returned. This nevvly constructed ob- 
fect does not affect rendering until it is modifted for the first time. After the first modification the obiect becomes 
live, such that any modifications made to the corresponding attribute are immediately reflected in the obiect. 

For example, if rectElement .x .baseVal is accessed and the “x” attribute vvas not specifted in the document, 
the returned SVG DOM obiect vvould represent the value 0 user uniits. 

For cases vvhere an attribute has a default value the returned SVG DOM obiect that must reflect that value, 
and for all other cases the obfect is initialized as described belovv. If a particular SVG DOM interface is not listed 
belovv that means that the obiect initialization shall be done using the values for the obiects that the interface 
contains, e.g DOMString in the case of SVGAnimatedString, or four floats in the case of SVGRect. 


SVGTextContentElement textLength 
mitialized vvith the return-value of getComputedTextLength on the same element. 
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DOMsString 
mitialized as the empty string (""). 
float 
long 
short 
mitialized as 0. 
boolean 
mitialized as false. 
SVGLength 
mitialized as 0 user units (SVG LENGTHTYPE NUMBER). 
SVGLengthlList 
SVGNumberlist 
SVGPointList 
SVGtringlList 
SVGTransformList 
mitialized as the empty list. 
SVGAngle 
mitialized as 0 in unspecified units (SVG ANGLETYPE UNSPECIFTED). 
SVGZoomAndPan 
mitialized as 0 (SVG ZOOMANDPAN UNKNOVVN). 
SVGPreserveAspectRatio 
mitialized as "xMidYMid meet", 


B.2 Elements in the SVG DOM 


Every Element obyect that corresponds to an SVG element (that is, an element vvith namespace URI "ht- 
tp://VVVVVV.VV3.OTg/ 2000/svg" and a İocal name that is one of the elements defined in this specification) must also 
implement the DOM interface identifted in element definition. For example, in The “rect” element, the SVGRectEle- 
ment interface is identified. This means that every Element obyect vvhose namespace URİI is "http:/ /vvvvVv.Vv3.oTg/ 
2000/svg" and vvhose local name is "rect" must also implement SVGRectElement. 


B.3 Naming conventions 


"The SVG DOM follovvs similar naming conventions to the Document Obiect Model HTML (TDOM1), chapter 2). 
AİI names are defined as one or more English vvords concatenated together to form a single string. Property 
or method namers start vvith the initial keyvvord in İovvercase, and each subsequent vvord starts vvith a capital letter. 
For example, a property that returns document meta information such as the date the file vvas created might be 
named "fileDateCreated". In the ECMASeript binding, properties are exposed as properties of a given obiect. In 
ava, properties are exposed vvith get and set methods. 
For attributes vvith the CDATA data type, the case of the return value is that given in the source document. 
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B.4 Exception SVGException 


"his exception is raised vvhen a specific SVG operation is impossible to perform. 


exception SVGException ( 
unsigned short code, 

y 
// SVGException code 

const unsigned short SVG VRONG TYPE ERR 0, 

const unsigned short SVG TINVALTD VALUE ERR £ 1, 
const unsigned short SVG MATRIX NOT INVERTABLE £ 2, 


Constants in group “SVGException code”: 


e SVG VVRONG TYPE ERR (unsigned short) 


Raised vvhen an obiect of the vvrong type is passed to an operation. 
Note that no operation is defined to raise an SVGException vvith this code in SVG 1.1 Second Edition. 
"The constant remains defined here for consisteney vvith SVG 1.1 First Edition. 


e SVG INVALID VALUEK ERR (unsigned short) 


Raised vvhen an invalid value is passed to an operation or assigned to an attribute. 


e SVG MATRIX NOT INVERTABLEF (tinsigned short) 


Raised vvhen an attempt is made to invert a matrix that is not invertible. 
Note the unusual spelling of this constant, vvhich is necessary for compatibility vvith existing content. 


Exception members: 


code (unsigned short) 
A code identifying the reason vvhy the requested operation could not be performed. The value of this 
member vvill be one of the constants in the SVGException code group. 


B.5 Feature strings for the hasFeature method call 


"The feature strings that are available for the hasFeature method call that is part of the SVG DOM s support for 
the DOMlmplementation interface defined in DOM Level 2 Core İDOM2) are the same features strings available 
for the “requiredFeatures” attribute that is available for many SVG elements. 

For all features that correspond to the SVG language and are documented in this specification (see appendix 
Feature Strings for a list of features in the SVG language), the version number for the hasFeature method call is 
"1.1". For features that correspond to other languages, refer to the relevant other specifications to determine the 
appropriate version number for the given feature. 


B.6 Relationship vvith DOM Level 2 Events 


The SVG DOM suppotts all of the interfaces defined in, and the follovving event types from, DOM Level 2 Events 
İDOM2EVENTSİ: 
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e "These User Interface events (İDOM2EVENTSİ), section 1.6.1): 
o DOMFocuslin 
o DOMFocusOut 
o DOMaActivate 
e "Ihese mouse events (İDOM2EVENTS), section 1.6.2): 
o click 
o mousedovn 





o mouseup 
o mouseover 
e mousemove 
o mouseout 
clientX and clientY parameters for mouse events represent the mouse coordinates at vvhich the event occurred 
relative to the DOM Implementation:s client area. relafedTarget is used to identify a secondary EventTarget 
related to a Ül event. Currently this attribute is used vvith the mouseover event to indicate the EventTarget 
vvhich the pointing device exited and vvith the mouseout event to indicate the EventTarget vvhich the pointing 
device entered. 
e "Ihese mutation events (İDOM2EVENTSİ, section 1.6.4): 
o DOMSubtreeModified 
o DOMNodelnserted 
o DOMNodeRemoved 
o DOMNodeRemovedFromDocument 
o. DOMNodelnsertedintoDocument 
o DOMAttrModified 
o. DOMCharacterDataModifted 
e "he SVG DOM defines the follovving SVG-specific custom event interfaces. These event interfaces are man- 
datory for SVG user agents: 
o SVGLoad 
o SVGünload 
o SVGAbort 
o SVGError 
o SVGResize 
o SVGöeroll (triggered by either seroll or pan user actions) 
Note that the SVGLoad event does not fire until the document is fully loaded and is therefore subiect to the 
processing of any “externalResourcesRequired” attributes. 
e "he SVG DOM defines an additional custom event interface: 
o SVGZoom (definition can be found in the deseription of the SVGZoomEvent interface) 
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e “The follovving event types are triggered due to state changes in animations. (Ihe definitions for these events 
can be found in the description of the TimeEvent interface.) 
o beginEvent 
o endEvent 
o repeatEvent 


VVhile event listeners can be registered using an addEventListener call on any element in the DOM, the use of 
event attributes on elements vvhere those attributes are disallovved vvill not result in their being invoked if the rel- 
evant event is dispatched to the element. For example, if the “onclick” attribute vvere specifted on a “title” element, 


its contents vvould never be run in response to a click event: 


xsvg xmlnsz"http: / /vvv.v3.org/2000/svg"z 
etitle onclick-"alert("Hello")"sInvalid event attributec/title”r 
€script” 
// Find the "title" element. 
var title - document .getElementsByTagNameNS( "http: / /vvuv.v3.org/2000/svg", "title")101, 


// Create and initialize a "click" event. 

var event document .createEvent ( "MouseEvent"), 

event.initMouseEvent("click", true, false, this, 1, 0, 0, 0, 0, false, 
false, false, false, 0, nu11), 


// Dispatch the event to the "title" element. Since onclicke"" is not 
// alloved on "title", the alert vill not shov. 
title.dispatchEvent(event), 
c/scripto 
x/ svg” 


See the Attribute Index for details on vvhich elements a given event attribute is allovved to be specifted on. 

Implementors may vievv the setting of event attributes as the creation and registration of an EventListener 
on the EventTarget. Such event listeners are invoked only for the "bubbling" and "at target" phases, as if false vvere 
specifted for the useCapture argument to addEventListener. This EventListener behaves in the same manner as 
any other vvhich may be registered on the EventTarget. 

Ifthe attribute representing the event listener is changed, this may be vievved as the removal of the previously 
registered EventListener and the registration of a nevv one. Futhermore, no specification is made as to the order in 
vvhich event attributes vvill receive the event vvith regards to the other EventListeners on the EventTarget. 

Im lava, one vvay that event listeners can be established is to define a class vvhich implements the EventListen- 


er interface, such as: 


class MyAction1 implements EventListener 1 

public void handleEvent (Event evt) 1 

// process the event 

l 
l 
// .cu, datöar səsə 
MyAction1 mc1 £“ nev MyAction1(), 
myElement .addEventListener("DOMActivate", mc1, false), 
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m ECMAseript, one vray to establish an event listener is to define a function and pass that function to the ad- 
dEventListener method: 


function myAction1(evt) 1 
// process the event 


1 
// ... later ... 
myElement .addEventListener("DOMActivate", myActionl, false) 


In ECMAsSeript, the character data content of an event attribute becomes the definition of the ECMASeript func- 
tion vvhich gets invoked in response to the event. As vvith all registered ECMASeript event listener functions, this 
function receives an Event obiect as a parameter, and the name of the Event obiect is evt. For example, it is pos- 
sible to vvrite: 


xerect onactivatee"MyActivateHandLler (evt)" .../s 


vvhich vvill pass the Event obfect evt into function MyActivateHandler. 


B.7 Relationship vvith DOM Level 2 CSS 


B.7.1 Introduction 


The section describes the facilities from DOM Level 2 CSS (IDOM2STYLE), chapter 2) that are part of the SVG 
DOM. 


B.7.2 User agents that do not support styling vvith CSS 


User agents that do not support styling vvith CSS are only required to support the follovving interfaces from DOM 
Level 2 CSS (İDOM2STYLE), chapter 2), along vvith any interfaces necessary to implement the interfaces, such as 
CSSPrimitiveValue and CSSValuelist. These interfaces are used in con/unction vvith the getPresentationAttribute 
method call on interface SVGStiylable, vvhich must be supported on all implementations of the SVG DOM. 


e Interface RGBColor 
e Interface CSSValue 


B.7.3 User agents that support siyling vvith CSS 


User agents that support Styling vvith CSS, the SVG DOM, and aural styling (TCSS2), chapter 19) must support all 
of the interfaces defined in DOM Level 2 CSS (İDOM2STYLE), chapter 2) vvhich apply to aural properties. 

For visual media (İCSS2), section 7.3.1), user agents must support all of the required interfaces defined in 
DOM Level 2 CSS. All of the interfaces that are optional for DOM Level 2 CSS are also optional for user agents 
implementing the SVG DOM. 
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B.7.4 Extended interfaces 


Note: the getPresentationAttribute method and the interfaces that extend CSSValue are deprecated, and may be 
dropped from future versions of the SVG specification. 

VVhether or not a user agent supports styling vvith CSS, a user agent still must support interface CSSValue, as 
this is the type that is returned from the getPresentationAttribute method call on interface SVGStylable. 

DOM Level 2 CSS defines a set of extended interfaces (TDOM2STYLE), section 2.3) for use in con/unction 
vvith interface CSSValue. The table belovv specifies the type of CSSValue used to represent each SVG property 
that applies to visual media (TCSS2İl, section 7.3.1). The expectation is that the CSSValue returned from the 
getPropertyCSSValue method on the CSSStyleDeclaration interface or the getPresentationAttribute method on the 
SVGStylable interface can be cast dovvn, using binding-specific casting methods, to the specific derived interface. 

For properties that are represented by a custom interface (the essValueType of the CSSValue is 
CSS CUSTOM), the name of the derived interface is specifted in the table. For these properties, the table belovv 
indicates vvhich extended interfaces are mandatory and vvhich are not. 

For properties that consist of lists of values (the cssValueType of the CSSValue is CSS VALUE LIST), 
the derived interface is CSSValueList. For all other properties (the essValueType of the CsSSValue is 
CSS PRIMITIVE VALUB), the derived interface is CSSPrimitiveValue. 

For shorthand properties, a CSSValue alvvays vvill have a value of null, Shorthand property values can only 
be accessed and modifted as strings. 

The SVG DOM defines the follovving SVG-specific custom property interfaces, all of vvhich are mandatory for 
SVG user agenis: 


ə SVGColor 
e SVGICCColor 
e SVGPaint 
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Mandatory? 
UL ANLİLL Representation (Extended interfaces only) 
“alignment-baseline” ident 
“baseline-shift” ident, length, percentage 
“clip” rect, ident 
“clip-path” uri, ident 
“clip-rule” ident 
“color” rgbcolor, ident 
“color-interpolation” ident 
“color-profile” list of strings, uri"s and idents 
“color-rendering” ident 
“cursor” uri, ident no 
“direction” ident 
“display” ident 
“dominant-baseline” ident 
“enable-background” list of idents and numbers 
“fil” SVGPaint yes 
“fill-opacity” number 
“fill-rule” ident 
“filter” uri, ident 
“flood-color” SVGColor yes 
“flood-opacity” number 
“font” null 
“font-family” list of strings and idents 
“font-size” ident, length, percentage 
“font-size-adiust” number, ident 


“font-stretch” ident 


“font-style” ident 
“font-variant” ident 
“font-vveight” ident 
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“glyph-orientation-horizontal” ident 





“glyph-orientation-vertical” ident 

“image-rendering” ident 

“kerning” ident, length 

“letter-spacing” ident, length 

“lighting-color” SVGColor yes 
“marker” null 

“marker-end” uri, ident 

“marker-mid” uri, ident 

“marker-start” uri, ident 

“mask” uri, ident 

“opacity” number 

“overflovv” ident 

“pointer-events” ident 

“shape-rendering” ident 

“stop-color” SVGColor yes 
“stop-opacity” number 

“stroke” SVGPaint yes 
“stroke-dasharray” ident or list of lengths 
“stroke-dashoffset” length 

“stroke-linecap” ident 

“stroke-lineioin” ident 

“stroke-miterlimit” length 


“stroke-opacity” number 
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“stroke-vvidth” length 
“text-anchor” ident 
“text-decoration” list of ident 
“text-rendering” ident 
“unicode-bidi” ident 
“visibility” ident 
“vord-spacing” length, ident 
“vriting-mode” ident 


B.8 Read only nodes in the DOM 


Some operations and attributes in the SVG DOM are defined to raise an exception vvhen an attempt is made to 
modify a node in the DOM that is read only. Such read only nodes are not related to attributes declared in IDL 
vvith the readonly keyvvord. Rather, they are nodes that cannot be modifted by virtue of being defined as readonly 
nodes by DOM Level 2 Core (İDOM2), Glossary appendix). Specifically, Entity and EntityReference nodes and 
their descendants are read only (İDOM2), section 1.3). 


B.9 Invalid values 


If a script sets a DOM attribute to an invalid value (e.g., a negative number for an attribute that requires a non- 
negative number or an out-of-range value for an enumeration), unless this specification indicates othervvise, no 
exception shall be raised on setting, but the given document fragment shall become technically in error as de- 


seribed in Error processing. 
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Appendix C: IDL Definitions 


This appendix is normative. 


"This appendix contains the complete OMG TDL for the SVG Document Obieet Model definitions. The TDL is also 
available at: 


http :/ /vnvv/..v/3..0rg/TR/2011/REC-SVG11-20110816/svg.idl 


The SVG TDL defines the model for the SVG DOM. Note that the SVG TDL is defined such that some interfaces 
have more than one base class. "The different standard language bindings for the SVG DOM are responsible for 
defining hovv to map all aspects of the SVG DOM into the given language, including hovv the language should 
implement interfaces vvith more than one base class. 


module smil ( 


interface ElementTimeControl ( 
void beginElement(), 
void beginElementAt(in float offset), 
void endElement(), 
void endElementAt(in float offset), 
y 


interface TimeEvent : Event ( 


readonly attribute AbstractViev viev, 
readonly attribute long detail, 


void initTimeEvent(in DOMString typeArg, in AbstractViev vievArg, in long detailArg), 
y 


y 
module svg 1 


exception SVGException ( 
unsigned short code, 
y 


// SVGException code 

const unsigned short SVG VRONG TYPE ERR 0, 

const unsigned short SVG TINVALTD VALUE ERR 1, 
const unsigned short SVG MATRIX NOT INVERTABLE £ 2, 


interface SVGElement : Element 1 
attribute DOMString id setraises(DOüMException), 
attribute DOMString xmlbase setraises (DÜMException), 
readonly attribute SVGSVGElement ovnerSVGElement , 
readonly attribute SVGElement vievportElement, 
Y 


interface SVGAnimatedBoolean ( 
attribute boolean baseVal setraises(DOMException), 
readonly attribute boolean animVal, 


H 


interface SVGAnimatedString ( 

attribute DOMString baseVal setraises (DÜMException), 
readonly attribute DOMString animVal, 

y 


interface SV6GStringList ( 





readonly attribute unsigned long numberOfTtems, 


void clear() raises(DOMException), 
DOMString initialize(in DOMString nevltem) raises (DOMException), 
DOMString getItem(in unsigned long index) raises(DOMException) , 
DOMString insertItemBefore(in DOMString nevltem, in unsigned long index) raises(DÜüMException), 
DOMString replaceltem(in DÜMString nevTItem, in unsigned long index) raises(DOMException), 
DOMString removeltem(in unsigned long index) raises(D0MException) , 
DOMString appendItem(in DOMString nevltem) raises (DOMException), 
y 
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interface SVGAnimatedEnumeration 1 
attribute unsigned short baseVal setraises (DÜMException) , 
readonly attribute unsigned short animVal, 


y 


interface SVGAnimatedinteger ( 

attribute long baseVal setraises(DOüMException) , 
readonly attribute long animVal, 
y 


interface SV6Number ( 
attribute float value setraises(DOüMException) , 
n 





interface SVGAnimatedNumber 1 

attribute float baseVal setraises(DÜMException) , 
readonly attribute float animVal, 
y 


interface SV6NumberList ( 
readonly attribute unsigned 1ong numberOfTtems, 


void clear() raises(DÜMException) , 
SVGNumber initialize(in SVGNumber nevltem) raises (DOMException) , 
SVGNumber getTtem(in unsigned long index) raises (DOÜMException) , 
SVGNumber insertItemBefore(in SVGNumber nevTtem, in unsigned long index) raises(D0MException), 
SVGNumber replaceTtem(in SVGNumber nevTItem, in unsigned long index) raises(D0MException) , 
SVGNumber removeltem(in unsigned long index) raises(DOüMException), 
SVGNumber appendItem(in SVGNumber nevItem) raises(DOMException) , 
y 


interface SVGAnimatedNumberList ( 

readonly attribute SVGNumberList baseVal, 
readonly attribute SV6GNumberList animVal, 
y 


interface SV6GLength (f 


// Length Unit Types 
const unsigned short SVG LENGTHTYPE UNKNOMN — 0, 
const unsigned short SVG LENGTHTYPE NUMBER £ 1, 
const unsigned short SVG LENGTHTYPE PERCENTAGE £ 2, 
const unsigned short SVG LENGTHTYPE EMS c 3, 

const unsigned short SVG LENGTHTYPE EXS c 4, 

const unsigned short SVG LENGTHTYPE PX 
const unsigned short SVG LENGTHTYPE CM 
const unsigned short SVG LENGTHTYPE MM 
const unsigned short SVG LENGTHTYPE IN 
const unsigned short SVG LENGTHTYPE PT 
const unsigned short SVG LENGTHTYPE PC 


readonly attribute unsigned short unitType, 
attribute float value setraises(DÜüMException) , 
attribute float valuelnSpecifiedUnits setraises(DÜMException) , 
attribute DOMString valueAsString setraises(DOMException) , 


void nevValueSpecifiedUnits(in unsigned short unitType, in float valuelnSpecifiedUnits) raises (DOMException) , 
void convertToSpecifiedUnits(in unsigned short unitType) raises(DOMException) , 
ik 


interface SVGAnimatedLength 1 

readonly attribute SVGLength baseVal, 
readonly attribute SVGLength animVal, 
y 
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interface SVGLengthList ( 
readonly attribute unsigned 1ong numberOfTtems, 


void clear() raises(DÜMException) , 
SVGLength initialize(in SVGLength nevltem) raises(DOMException) , 
SVGLength getTtem(in unsigned long index) raises (DOÜMException) , 
SVGLength insertItemBefore(in SVGLength nevItem, in unsigned long index) raises(D0MException), 
SVGLength replaceTtem(in SVGLength nevTItem, in unsigned long index) raises(D0MException) , 
SVGLength removeltem(in unsigned long index) raises(DüMException), 
SVGLength appendItem(in SVGLength nevlItem) raises(DOMException) , 
ik 


interface SVGAnimatedLengthlList ( 

readonly attribute SVGLengthList baseVal, 
readonly attribute SVGLengthList animVal, 
y 


interface SVGAngle 1 


// Angle Unit Types 

const unsigned short SVG ANGLETYPE UNKNOUN 0, 
const unsigned short SVG ANGLETYPE UNSPECTIFTED £ 1, 
const unsigned short SVG ANGLETYPE DEG £ 2, 

const unsigned short SVG ANGLETYPE RAD z 3, 

const unsigned short SVG ANGLETYPE GRAD £ 4, 


readonly attribute unsigned short unitType, 
attribute float value setraises(DÜüMException), 
attribute float valuelnSpecifiedUnits setraises(DÜMException) , 
attribute DOMString valueAsString setraises(DOüMException), 


void nevValueSpecifiedUnits(in unsigned short unitType, in float valuelnSpecifiedUnits) raises (DOMException), 
void convertToSpecifiedUnits(in unsigned short unitType) raises(DOMException) , 
y 


interface SVGAnimatedAngle ( 

readonly attribute SVGAngle baseVal, 
readonly attribute SVGAngle animVal, 
y 


interface SVGColor : CSSValue 1 


// Color Types 

const unsigned short SVG COLORTYPE UNKNOUN 0, 

const unsigned short SVG COLORTYPE RGBCOLOR 1, 

const unsigned short SVG COLORTYPE RGBCOLOR TCCCOLOR £ 2, 
const unsigned short SVG COLORTYPE CURRENTCOLOR 3, 


readonly attribute unsigned short colorType, 
readonly attribute RGBColor rgbColor, 
readonly attribute SVGICCColor iccColor, 


void setRGBColor(in DOMString rgbColor) raises(SVGException), 

void setRGBColorICCColor(in DOMString rgbColor, in DOMString iccColor) raises(SVGException) , 

void setColor(in unsigned short colorType, in DOMString rgbColor, in DÜMString iccColor) raises(SVGException), 
y 


interface SVGICCColor ( 

attribute DOMString colorProfile setraises(DÜüMException) , 
readonly attribute SVGNumberList colors, 
y 


interface SVGRect 1f 
attribute float x setraises(DÜMException) , 
attribute float y setraises(DÜUMException), 
attribute float vidth setraises(DOMException) , 
attribute float height setraises(DOMException) , 
y 


interface SVGAnimatedRect 1 

readonly attribute SVGRect baseVal, 
readonly attribute SV6GRect animVal, 
y 


interface SVGUnitTypes ( 

// Unit Types 

const unsigned short SVG UNIT TYPE UNKNOMN £ 0, 

const unsigned short SVG UNIT TYPE USERSPACEONUSE £ 1, 
const unsigned short SVG UNIT TYPE O0B2ECTBOUNDINGBOX £ 2, 
iR 


interface SV6Stylable 1 
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readonly attribute SVGAnimatedString className, 
readonly attribute CSSStyleDeclaration style, 


CSSValue getPresentationAttribute(in DOMString name), 
iR 


interface SUVGLocatable ( 


readonly attribute SVGElement nearestVievportElement, 
readonly attribute SVGElement farthestVieuportElement, 


SVGRect getBBox() , 

SVöMatrix getCTM(), 

SVöMatrix getScreenCTM() , 

SVGMatrix getTransformToElement(in SVGElement element) raises(SVGException) , 
y 





interface SV6Transformable : SVGLocatable f 
readonly attribute SVGAnimatedTransformList transform, 
y 


interface SV6Tests 1 


readonly attribute SVGStringList requiredFeatures, 
readonly attribute SVGStringList requiredExtensions, 
readonly attribute SVGStringList systemLanguage, 


boolean hasExtension(in DOMString extension), 


H 


interface SVGLangSpace ( 
attribute DOMString xmllang setraises(DOMException) , 
attribute DOMString xmlspace setraises (DOMException) , 
y 


interface SVGExternalResourcesRequired 1 
readonly attribute SVGAnimatedBoolean externalResourcesRequired, 
y 


interface SV6FitToVieuBox 4 

readonly attribute SVGAnimatedRect vievBox, 

readonly attribute SVGAnimatedPreserveAspectRatio preserveAspectRatio, 
y 


interface SV6ZoomAndPan ( 


// Zoom and Pan Types 
const unsigned short SVG Z00MANDPAN UNKNOVN 
const unsigned short SVG Z00MANDPAN DISABLE 


0 
1, 
const unsigned short SVG Z00MANDPAN MAGNTFY - 2 


, 


attribute unsigned short zoomAndPan setraises (DOMException) , 
iL 


interface SV6VieuvSpec : SVGZoomAndPan, 
SVGFitToVievBox ( 
readonly attribute SVGTransformList transform, 
readonly attribute SVGElement vievTarget, 
readonly attribute DOMString vievBoxString, 
readonly attribute DOMString preserveAspectRatioString, 
readonly attribute DOMString transformString, 
readonly attribute DOMString vievTargetString, 
y 


interface SVGURIReference 1 


readonly attribute SVGAnimatedString href, 
Y 


interface SVGCSSRule : CSSRULe 1 
const unsigned short COLOR PROFTLE RULE £ 7, 


H 
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interface SV6GRenderingintent ( 
// Rendering Tntent Types 
const unsigned short RENDERING INTENT UNKNOMN - 6, 
const unsigned short RENDERING INTENT AUTO £— 1, 
const unsigned short RENDERING TINTENT PERCEPTUAL c 2, 


const unsigned short RENDERING INTENT RELATIVE COLORTMETRİIC 3, 
const unsigned short RENDERING INTENT SATURATTON c 4, 
const unsigned short RENDERING INTENT ABSOLUTE COLORTMETRİC c 5, 


H 


interface SV6Document : Document, 
DocumentEvent ( 
readonly attribute DÜUMString title, 
readonly attribute DOMString referrer, 
readonly attribute DOMString domain, 
readonly attribute DOMString URL, 
readonly attribute SVGSVGElement rootElement, 
y 


interface SV6SVGElement : SVGElement, 
SV6GTests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVGstylable, 
SVGLocatable, 
SVGFitToVievBox, 
SVGZoomAndPan, 
DocumentEvent, 
VievCSS, 
DocumentCSS ( 





readonly attribute SVGAnimatedLength x, 

readonly attribute SVGAnimatedLength y, 

readonly attribute SVGAnimatedLength vidth, 

readonly attribute SVGAnimatedLength height, 

attribute DOMString contentScriptType setraises(DOMException), 
attribute DOMString contentStyleType setraises (DOMException) , 


readonly attribute SVGRect vievport, 
readonly attribute float pixelUnitToMillimeterX, 
readonly attribute float pixelUnitToMillimeterY, 
readonly attribute float screenPixelToMillimeterX, 
readonly attribute float screenPixelToMillimeterY, 
readonly attribute boolean useCurrentViev, 

y 


attribute SV6VievSpec currentViev, 
attribute float currentScale, 
readonly attribute SVGPoint currentTranslate, 


readon 





unsigned long suspendRedrav(in unsigned long maxllaitMilliseconds) , 
void unsuspendRedrav(in unsigned long suspendHandleTD) , 

void unsuspendRedravA11(), 

void forceRedrav(), 

void pauseAnimations( ), 

void unpauseAnimations(), 

boolean animationsPaused(), 

Tloat getCurrentTime(), 

void setCurrentTime(in float seconds), 

NodeList getIntersectionList(in SVGRect rect, in SVGElement referenceElement), 
NodeList getEnclosureList(in SVGRect rect, in SVGElement referenceElement), 
boolean checkIntersection(in SVGElement element, in SVGRect rect), 
boolean checkEnclosure(in SVGElement element, in SVGRect rect), 
void deselectAl1(), 

SVGNumber createSVöNunber() 

SVGLength createSVGLength() 

SVGAngle createSVGAngle() , 

SVöPoint createSVGPoint(), 

SVGMatrix createSVGMatrix(), 

SVGRect createSVGRect(), 

SVGTransform createSVGTransforn() , 


SVGTransform createSVGTransformFromMatrix(in SVGMatrix matrix), 
Element getElementBy1d(in DOMString elementl1d), 
y 


interface SV6GElement : SVGElement, 
SVGTests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVöstylable, 
SVGTransformable £ 
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H 


interface SV6DefsElement : SVGElement, 
SVGTests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVGStylable, 
SVGTransformable 1 

y 


interface SV6DescElement : SVGElement, 
SVGLangSpace, 
SVGStylable ( 





H 


interface SVGTitleElement : SVGElement, 
SVGLangSpace, 
SVöstylable f 
y 


interface SV6SymbolElement : SVGElement, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVöStylable, 
SVGFitToVievBox (f 

y 


interface SVGUseElement : SVGElement, 
SVGURTReference, 
SVGTests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVöstylable, 
SVGTransformable £ 

readonly attribute SVGAnimatedLength x, 

readonly attribute SVGAnimatedLength y, 

readonly attribute SVGAnimatedLength vidth, 

readonly attribute SVGAnimatedLength height, 

readonly attribute SVGElementInstance instanceRoot, 

readonly attribute SVGElementInstance animatedInstanceRoot, 


H 


interface SVGElementIinstance : EventTarget 1 





readonly attribute SVGElement correspondingElement, 
readonly attribute SVGUseElement correspondingüUseElement, 
readonly attribute SVGElementInstance parentNode, 
readonly attribute SVGElementInstanceList childNodes, 
readonly attribute SVGElementInstance firstChild, 
readonly attribute SVGElementInstance lastChild, 
readonly attribute SVGElementInstance previousSibling, 
readonly attribute SVGElementInstance nextSibling, 

y 


interface SVGElementinstanceList 1 





readonly attribute unsigned long length, 


SVGElementinstance item(in unsigned long index), 


y 

interface SV6ImageElement : SVGElement, 
SVGURTReference, 
SVGTests, 
SVGLangSpace, 


SVGExternalResourcesRequired, 


SVGStylable, 
SV6GTransformable 1 
readonly attribute SVGAnimatedLength x, 
readonly attribute SVGAnimatedLength y, 
readonly attribute SVGAnimatedLength vidth, 
readonly attribute SVGAnimatedLength height, 
readonly attribute SVGAnimatedPreserveAspectRatio preserveAspectRatio, 
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y 

interface SV6GSvitchElement : SVGElement, 
SVGTests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVöStylable, 
SVGTransformable 1 

Y 


interface GetSVGDocument 1 
SVGDocument getSVGDocument () , 
y 


interface SV6StyleElement : SVGElement, 
SVGLangSpace 1 
attribute DOMString type setraises(DOMException) , 
attribute DOMString media setraises(DOMException), 
attribute DOMString title setraises(DOMException), 
y 





interface SVöPoint ( 


attribute float x setraises(DÜUMException), 
attribute float y setraises(DÜMException), 


SVöPoint matrixTransform(in SVGMatrix matrix), 


Y 
interface SV6PointList ( 
readonly attribute unsigned 1ong numberOfTtems, 


void clear() raises(DOMException), 
SVöPoint initialize(in SVGPoint nevltem) raises(DüMException) , 
SVGPoint getItem(in unsigned long index) raises(DüMException), 
SV6Point insertItemBefore(in SVGPoint nevltem, in unsigned long index) raises(DOMException), 
SVGPoint replaceltem(in SVGPoint nevTtem, in unsigned long index) raises(D0MException) , 
SVGPoint removeTtem(in unsigned long index) raises(DOMException), 
SVGPoint appendItem(in SVGPoint nevltem) raises(DOMException) , 
y 


interface SV6Matrix ( 


attribute float 
attribute float 
attribute float 
attribute float 
attribute float 
attribute float 


setraises (DOMException) , 
setraises (DOMException) , 
setraises (DOMException) , 
setraises (DOMException), 
setraises (DOMException) , 
setraises (DOMException) , 


“O Qo 0 


SV6Matrix multiply(in SVGMatrix secondMatrix), 
SV6Matrix inverse() raises(SVGException), 
SVGMatrix translate(in float x, in float y), 
SVöMatrix scale(in float scaleFactor), 
SVGMatrix scaleNonUniform(in float scaleFactorX, in float scaleFactorY), 
SVGMatrix rotate(in float angle), 
SVGMatrix rotateFromVector(in float x, in float y) raises(SVGException), 
SVöMatrix flipX(), 
SVöMatrix flipY(), 
SVGMatrix skevX(in float angle), 
SVGMatrix skevY(in float angle), 
Y 


interface SV6Transform f 


// Transform Types 
const unsigned short SVG TRANSFORM UNKNOUN - 0, 


const unsigned short SVG TRANSFOURM MATRIX £ 1, 
const unsigned short SVG TRANSFORM TRANSLATE z 2, 
const unsigned short SVG TRANSFORM SCALE z 3, 
const unsigned short SVG TRANSFORM ROTATE z 4, 
const unsigned short SVG TRANSFORM SKEVX 
const unsigned short SVG TRANSFORM SKEVY 


5) 
6) 
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readonly attribute unsigned short type, 
readonly attribute SVGMatrix matrix, 
readonly attribute float angle, 


void setMatrix(in SVGMatrix matrix) raises(DÜMException) , 
void setTranslate(in float tx, in float ty) raises(D0MException) , 
void setScale(in float sx, in float sy) raises(DOüMException), 
void setRotate(in float angle, in float cx, in float cy) raises(D0MException) , 
void setSkevX(in float angle) raises(DOMException) , 
void setSkevY(in float angle) raises(DOMException), 
y 


interface SV6TransformList ( 


readonly attribute unsigned 1ong numberOfTtems, 





void clear() raises(DÜMException) , 
SVGTransform initialize(in SVGTransform nevltem) raises(DÜMException), 
SVGTransform getIltem(in unsigned long index) raises(DüMException), 
SVGTransform insertItemBefore(in SVGTransform nevTtem, in unsigned long index) raises(DOMException) , 
SVGTransform replaceltem(in SVGTransform nevİltem, in unsigned long index) raises (DÜMException), 
SVGTransform removeTtem(in unsigned long index) raises(DOMException), 
SVGTransform appendTtem(in SVGTransform nev/Ttem) raises (DOMException) , 
SVGTransform createSVGTransformFromMatrix(in SVGMatrix matrix), 
SVGTransform consolidate() raises (DüMException) , 
y 


interface SVGAnimatedTransformList ( 

readonly attribute SVGTransformList baseVal, 
readonly attribute SVGTransformList animVal, 
y 


interface SV6PreserveAspectRatio ( 


// Alignment Types 
const unsigned short SVG PRESERVEASPECTRATI0 UNKNOMN 0, 
const unsigned short SVG PRESERVEASPECTRATT0 NONE z 1, 
const unsigned short SVG PRESERVEASPECTRATI0 XMINYMIN 
const unsigned short SVG PRESERVEASPECTRATI0 XMIDYMIN 
const unsigned short SVG PRESERVEASPECTRATI0 XMAXYMIN 
const unsigned short SVG PRESERVEASPECTRATI0 XMINYMID 
const unsigned short SVG PRESERVEASPECTRATI0 XMIDYMID 
const unsigned short SVG PRESERVEASPECTRATI0 XMAXYMID 
const unsigned short SVG PRESERVEASPECTRATI0 XMINYMAX 
const unsigned short SVG PRESERVEASPECTRATI0 XMIDYMAX 
const unsigned short SVG PRESERVEASPECTRATI0 XMAXYMAX 
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Pe OO OO — UB) 
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// Meet-or-slice Types 

const unsigned short SVG MEETORSLICE UNKNOUMN - 0, 
const unsigned short SVG MEETORSLTICE MEET z 1, 
const unsigned short SVG MEETORSLTCE SLTCE £ 2, 


attribute unsigned short align setraises (DOMException) , 
attribute unsigned short meetürSlice setraises (DÜMException), 
y 


interface SVGAnimatedPreserveAspectRatio ( 

readonly attribute SVGPreserveAspectRatio baseVal, 
readonly attribute SVGPreserveAspectRatio animVal, 
y 


interface SV6PathSeg 


// Path Segment Types 

const unsigned short PATHSEG UNKNOVN 
const unsigned short PATHSEG CLOSEPATI 
const unsigned short PATHSEG MOVETÜO A 
const unsigned short PATHSEG MOVET0 R 
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const unsigned short PATHSEG LTNET0 ABS c 4, 

const unsigned short PATHSEG LTNET0 REL £ 5, 

const unsigned short PATHSEG CURVETO CUBIC ABS £— 6, 
const unsigned short PATHSEG CURVETO CUBIC REL £ 7, 
const unsigned short PATHSEG CURVETO QUADRATTC ABS 8, 
const unsigned short PATHSEG CURVETO QUADRATTC REL £ 9, 
const unsigned short PATHSEG ARC ABS £ 10, 

const unsigned short PATHSEG ARC REL £ 11, 

const unsigned short PATHSEG LINETO HORTZONTAL ABS £ 12, 
const unsigned short PATHSEG LINETO HORTZONTAL REL £ 13, 


const unsigned short PATHSEG LINETO VERTTCAL ABS £ 14, 
const unsigned short PATHSEG LINETO VERTTCAL REL £ 15, 
const unsigned short PATHSEG CURVETO CUBIC SMOOTH ABS — 16, 
const unsigned short PATHSEG CURVETO CUBIC SMOOTH REL £ 17, 
const unsigned short PATHSEG CURVETO QUADRATIC SMOOTH ABS 
const unsigned short PATHSEG CURVETO QUADRATIC SMOOTH REL 


readonly attribute unsigned short pathSegType, 
readonly attribute DOMString pathSegTypeAsLetter, 
y 


interface SV6PathSegClosePath : SVGPathSeg 1 
R 





interface SV6PathSegMovetoAbs : SVGPathSeg 1 
attribute float x setraises(DÜMException) , 
attribute float y setraises(DÜUMException), 

Y 


interface SV6PathSegMovetoRel : SVGPathSeg 1 
attribute float x setraises(DÜMException), 
attribute float y setraises(DÜUMException), 

y 


interface SV6PathSegLinetoAbs : SVGPathSeg £ 
attribute float x setraises(DÜMException), 
attribute float y setraises(DÜUMException), 
y 


interface SV6PathSegLinetoRel : SVGPathSeg 1 
attribute float x setraises(DÜMException) , 
attribute float y setraises(DÜMException), 

y 


interface SVGPathSegCurvetoCubicAbs : SVGPathSeg ( 
attribute float x setraises(DÜMException) , 
attribute float y setraises(DÜUMException), 
attribute float x1 setraises(DÜüMException) , 
attribute float y1 setraises(DOMException) , 
attribute float x2 setraises(DOMException) , 
attribute float y2 setraises(DOMException) , 

y 


interface SVGPathSegCurvetoCubicRel : SVGPathSeg ( 
attribute float x setraises(DÜMException) , 
attribute float y setraises(DÜUMException), 
attribute float x1 setraises(DÜMException), 
attribute float y1 setraises(DOMException) , 
attribute float x2 setraises(DÜMException) , 
attribute float y2 setraises(DOMException) , 

y 


interface SV6PathSegCurvetoQuadraticAbs : SVGPathSeg 1 
attribute float x setraises(DÜMException), 
attribute float y setraises(DÜUMException), 
attribute float x1 setraises(DÜMException), 
attribute float y1 setraises(DOMException) , 

y 


interface SV6PathSegCurvetoQuadraticRel : SVGPathSeg 1 
attribute float x setraises(DÜMException) , 
attribute float y setraises(DÜMException), 
attribute float x1 setraises(DÜüMException), 
attribute float y1 setraises(DOMException) , 

y 
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interface SVU6PathSegArcAbs : SVGPathSeg ( 


attribute 
attribute 
attribute 
attribute 
attribute 
attribute 
attribute 
y 


Tfloat x setraises(DOMException), 

Tloat y setraises (DOMException) , 

Tfloat r1 setraises(DÜMException), 

Tloat r2 setraises(DÜüMException), 

Tloat angle setraises (DOMException) , 

boolean largeArcFlag setraises (DOMException) , 
boolean sveepFlag setraises(D0üMException), 


interface SU6PathSegArcRel : SVGPathSeg ( 


attribute 
attribute 
attribute 
attribute 
attribute 
attribute 
attribute 
y 


float x setraises(DOMException), 

Tloat y setraises (DOMException) , 

Tfloat r1 setraises(DÜUMException), 

Tloat r2 setraises(DÜUMException), 

Tloat angle setraises (DOMException), 

boolean largeArcFlag setraises (DOMException) , 
boolean sveepFlag setraises(D0üMException), 


interface SV6PathSegLinetoHorizontalAbs : SVGPathSeg 1 


attribute 
ik 


float x setraises(DOMException) , 


interface SV6PathSegLinetoHorizontalRel : SVGPathSeg 1 


attribute 
y 


float x setraises(DüMException), 


interface SV6PathSegLinetoVerticalAbs : SVGPathSeg ( 


attribute 
y 


Tloat y setraises (DOMException) , 


interface SV6PathSegLinetoVerticalRel : SVGPathSeg ( 


attribute 
y 


Tloat y setraises (DOMException) 


interface SV6PathSegCurvetoCubicSmoothAbs : SVGPathSeg ( 


attribute 

attribute 

attribute 

attribute 
iR 


float x setraises(DOMException), 
Tloat y setraises (DOMException) , 
Tloat x2 setraises(DÜUMException), 
Tloat y2 setraises(DOMException) , 


interface SV6PathSegCurvetoCubicSmoothRel : SVGPathSeg ( 


attribute 

attribute 

attribute 

attribute 
y 


float x setraises(DOMException) , 
Tloat y setraises (DOMException) , 
Tloat x2 setraises(DÜüMException), 
Tloat y2 setraises(DOMException) , 


interface SV6PathSegCurvetoQuadraticSmoothAbs : SVGPathSeg 1 


attribute 
attribute 
y 


float x setraises(DüMException), 
Tloat y setraises (DOMException) 


interface SV6PathSegCurvetoQuadraticSmoothRel : SVGPathSeg ( 
attribute float x setraises(DÜMException), 
attribute float y setraises(DÜUMException), 


H 


interface SV6PathSegList ( 


readonly attribute unsigned 1ong numberOfTtems, 


void clear() raises(DÜMException) , 


SVGPathSeg 

SVGPathSeg 

SVGPathSeg 

SVGPathSeg 

SVGPathSeg 

SVGPathSeg 
y 


initialize(in SVGPathSeg nevTItem) raises (DOMException), 

getItem(in unsigned long index) raises(DüMException), 

insertItemBefore(in SVGPathSeg nevItem, in unsigned long index) raises (DOMException) , 
replaceltem(in SVGPathSeg nevltem, in unsigned long index) raises (DÜMException), 
removeltem(in unsigned long index) raises(D0MException) , 

appendItem(in SVGPathSeg nev/Ttem) raises (DOMException) , 


interface SVGAnimatedPathData 1 


readonly attribute SVGPathSegList pathSegList, 

readonly attribute SVGPathSegList normalizedPathSegList, 

readonly attribute SVGPathSegList animatedPathSegList, 

readonly attribute SVGPathSegList animatedNormalizedPathSegList, 
y 


interface SV6PathElement : SVGElement, 
SVGTests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVöStylable, 
SVGTransformable, 
SVGAnimatedPathData 1 
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readonly attribute SVGAnimatedNumber pathLength, 


Tloat getTotalLength(), 

SVGPoint getPointAtLength(in float distance), 

unsigned long getPathSegAtLength(in float distance), 

SVGPathSegClosePath createSVGPathSegClosePath() , 

SVGPathSegMovetoAbs createSVüPathSegMovetoAbs(in float x, in float y), 

SVGPathSegMovetoRel createSVGPathSegMovetoRel(in float x, in float y), 

SVGPathSegLinetoAbs createSVGPathSegLinetoAbs(in float x, in float y), 

SVGPathSegLinetoRel createSVGPathSegLinetoRel(in float x, in float y), 

SVGPathSegCurvetoCubicAbs createSVGPathSegCurvetoCubicAbs(in float x, in float y, in float x1, in float y1, in float 
x2, in float y2), 

SVGPathSegCurvetoCubicRel createSVGPathSegCurvetoCubicRel(in float x, in float y, in float x1, in float y1, in float 
x2, in float y2), 

SVGPathSegCurvetoQuadraticAbs createSVGPathSegCurvetoQuadraticAbs(in float x, in float y, in float x1, in float y1), 

SVGPathSegCurvetoQuadraticRel createSVGPathSegCurvetoQuadraticRel(in float x, in float y, in float x1, in float y1), 

SVGPathSegArcAbs createSVGPathSegArcAbs(in float x, in float y, in float r1, in float r2, in float angle, in boolean 
TlargeArcFlag, in boolean sveepFlag), 

SVGPathSegArcRel createSVGPathSegArcRel(in float x, in float y, in float r1, in float r2, in float angle, in boolean 
TargeArcFlag, in boolean sveepFlag), 

SVGPathSegLinetoHorizontalAbs createSVGPathSegLinetoHorizontalAbs(in float x), 

SVGPathSegLinetoHorizontalRel createSVGPathSegLinetoHorizontalRel(in float x), 

SVGPathSegLinetoVerticalAbs createSVGPathSegLinetoVerticalAbs(in float y), 

SVGPathSegLinetoVerticalRel createSVGPathSegLinetoVerticalRel(in float y), 

SVGPathSegCurvetoCubicSmoothAbs createSVGPathSegCurvetoCubicSmoothAbs(in float x, in float y, in float x2, in float 
y2): 

SVGPathSegCurvetoCubicSmoothRel createSVGPathSegCurvetoCubicSmoothRel(in float x, in float y, in float x2, in float 
yo): 
SVGPathSegCurvetoQuadraticSmoothAbs createSVGPathSegCurvetoQuadraticSmoothAbs(in float x, in float y), 
SVGPathSegCurvetoQuadraticSmoothRel createSVGPathSegCurvetoQuadraticSmoothRel(in float x, in float y), 
y 





interface SV6RectElement : SVGElement, 
SV6Tests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVöStylable, 
SVGTransformable 1 
readonly attribute SVGAnimatedLength x, 
readonly attribute SVGAnimatedLength y, 
readonly attribute SVGAnimatedLength vidth, 
readonly attribute SVGAnimatedLength height, 
readonly attribute SVGAnimatedLength rx, 
readonly attribute SVGAnimatedLength ry, 
y 


interface SV6GCircleElement : SVGElement, 
SV6GTests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVöStylable, 
SVGTransformable 1 

readonly attribute SVGAnimatedLength cx, 

readonly attribute SVGAnimatedLength cy, 

readonly attribute SVGAnimatedLength r, 

ik 


interface SVGEllipseElement : SVGElement, 
SVGTests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 


SVGStylable, 

SVGTransformable 1 
readonly attribute SVGAnimatedLength cx, 
readonly attribute SVGAnimatedLength cy, 
readonly attribute SVGAnimatedLength rx, 
readonly attribute SVGAnimatedLength ry, 
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interface SV6GLineElement : SVGElement, 
SVGTests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVGStylable, 


SV6GTransformable 1 
readonly attribute SVGAnimatedLength x1, 
readonly attribute SVGAnimatedLength y1, 
readonly attribute SVGAnimatedLength x2, 
readonly attribute SVGAnimatedLength y2, 

y 


interface SVGAnimatedPoints ( 

readonly attribute SVGPointList points, 
readonly attribute SVGPointList animatedPoints, 
y 





interface SV6PolylineElement : SVGElement, 
SVGTests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVGStylable, 
SVGTransformable, 
SVGAnimatedPoints ( 

y 


interface SV6PolygonElement : SVGElement, 
SVGTests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVGStylable, 
SVGTransformable, 
SVGAnimatedPoints (f 

y 


interface SVGTextContentElement : SVGElement, 
SV6Tests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVGstylable 1 


// 1engthAdiust Types 

const unsigned short LENGTHAD1UST UNKNOVN 0, 

const unsigned short LENGTHAD2UST SPACING 1, 

const unsigned short LENGTHAD2UST SPACINGANDGLYPHS 2, 


readonly attribute SVGAnimatedLength textLength, 
readonly attribute SVGAnimatedEnumeration lengthAdfiust, 


1ong getNumberOfChars(), 

Tloat getComputedTextLength() , 

float getSubStringLength(in unsigned long charnum, in unsigned long nchars) raises (DOMException) , 
SVGPoint getStartPositionOfChar(in unsigned long charnum) raises (Dü0MException), 

SVGPoint getEndPositionOfChar(in unsigned long charnum) raises (DOMException) , 

SVGRect getExtentOfChar(in unsigned long charnum) raises(DOMException) , 

float getRotationOfChar(in unsigned long charnum) raises(DOMException), 

long getCharNumAtPosition(in SVGPoint point), 

void selectSubString(in unsigned long charnum, in unsigned long nchars) raises(D0MException) , 


H 


interface SVGTextPositioningElement : SVGTextContentElement ( 
readonly attribute SVGAnimatedLengthList x, 
readonly attribute SVGAnimatedLengthList y, 
readonly attribute SVGAnimatedLengthList dx, 
readonly attribute SVGAnimatedLengthList dy, 
readonly attribute SVGAnimatedNumberList rotate, 
y 


interface SV6TextElement : SVGTextPositioningElement, 
SVGTransformable 1 
y 


interface SVGTSpanElement : SVGTextPositioningElement ( 
y 
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interface SVGTRefElement : SVGTextPositioningElement, 
SVGURTReference ( 
Y 


interface SV6GTextPathElement : SVGTextContentElement, 
SVGURTReference ( 


// textPath Method Types 

const unsigned short TEXTPATH METHODTYPE UNKNOUN 0, 
const unsigned short TEXTPATH METHODTYPE ALIGN c 1, 
const unsigned short TEXTPATH METHODTYPE STRETCH £ 2, 





// textPath Spacing Types 

const unsigned short TEXTPATH SPACINGTYPE UNKNOMN — 0, 
const unsigned short TEXTPATH SPACINGTYPE AUTO - 
const unsigned short TEXTPATH SPACINGTYPE EXACT £ 2, 





readonly attribute SVGAnimatedLength startOffset, 

readonly attribute SVGAnimatedEnumeration method, 

readonly attribute SVGAnimatedEnumeration spacing, 
y 


interface SVGAltGlyphElement : SVGTextPositioningElement, 
SVGURTReference 
attribute DOMString glyphRef setraises (DOMException) , 
attribute DOMString format setraises(DOMException) , 


y 

interface SVGAltGlyphDefElement : SVGElement 1 
y 

interface SVGAltGlyphItemElement : SVGElement (f 
y 

interface SVGGlyphRefElement : SVGElement, 


SVGURTReference, 
SVGStylable £ 

attribute DOMString glyphRef setraises (DOMException) , 

attribute DOMString format setraises(DOMException) , 

attribute float x setraises(DÜMException), 

attribute float y setraises(DÜUMException), 

attribute float dx setraises (DÜMException) , 

attribute float dy setraises(DOMException) , 

y 


interface SV6Paint : SVGColor (£ 


// Paint Types 

const unsigned short SVG PATINTTYPE UNKNOMN 0, 

const unsigned short SVG PAINTTYPE RGBCOLOR 1, 

const unsigned short SVG PATNTTYPE RGBCOLOR TCCCOLOR £ 2, 
const unsigned short SVG PAINTTYPE NONE - 101, 

const unsigned short SVG PATNTTYPE CURRENTCOLOR — 102, 
const unsigned short SVG PATNTTYPE URI NONE — 103, 

const unsigned short SVG PATINTTYPE URI CURRENTCOLOR 104, 
const unsigned short SVG PAINTTYPE URI RGBCOLOR — 105, 
const unsigned short SVG PAINTTYPE URI RGBCOLOR TCCCOLOR — 106, 
const unsigned short SVG PAINTTYPE URI £ 107, 


readonly attribute unsigned short paintType, 
readonly attribute DÜMString uri, 


void setUri(in DÜMString uri), 

void setPaint(in unsigned short paintType, in DOMString uri, in DOMString rgbColor, in DOMString iccColor) 
raises(SVGException), 
y 


interface SV6MarkerElement : SVGElement, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVöStylable, 
SVGFitToVievBox (f 


// Marker Unit Types 

const unsigned short SVG MARKERUNITS UNKNOUN - 0, 

const unsigned short SVG MARKERUNITS USERSPACEONUSE £ 1, 
const unsigned short SVG MARKERUNITS STROKEMTDTH z 2, 


c 
.o 
5 
İv) 
m") 
cc 
(3) 
E 
E 
ə) 
(ə) 
o 
ad 
. 
s 


// Marker Ürientation Types 

const unsigned short SVG MARKER ORTENT UNKNOMN — 0, 
const unsigned short SVG MARKER ORTENT AUTO - 
const unsigned short SVG MARKER ORTENT ANGLE 2, 





readonly attribute SVGAnimatedLength refTX, 

readonly attribute SVGAnimatedLength refY, 

readonly attribute SVGAnimatedEnumeration markerUnits, 
readonly attribute SVGAnimatedLength markerMidth, 
readonly attribute SVGAnimatedLength markerHeight, 
readonly attribute SVGAnimatedEnumeration orientType, 
readonly attribute SVGAnimatedAngle orientAngle, 





void setürientToAuto() raises(DOüMException) , 
void setOrientToAngle(in SVGAngle angle) raises (DÜMException), 
yx 


interface SV6GColorProfileElement : SVGElement, 
SVGURTReference, 
SVGRenderingintent ( 
attribute DOMString local, 
attribute DOMString name, 
attribute unsigned short renderingIintent, 


H 


interface SVGColorProfileRule : SVGCSSRULe, 
SVGRenderingintent 1 
attribute DOMString src setraises (DOMException) , 
attribute DOMString name setraises (DOMException), 
attribute unsigned short renderingIntent setraises (DOÜMException), 


y 

interface SVU66GradientElement : SVGElement, 
SVGURTReference, 
SVGExternalResourcesRequired, 
SVGStylable, 


SVGUnitTypes (f 


// Spread Method Types 


const unsigned short SVG SPREADMETHOD UNKNOMN — 0, 
const unsigned short SVG SPREADMETHOD PAD £ 1, 
const unsigned short SVG SPREADMETHOUD REFLECT 2, 


const unsigned short SVG SPREADMETHOD REPEAT z 3, 


readonly attribute SVGAnimatedEnumeration gradientuUnits, 
readonly attribute SVGAnimatedTransformList gradientTransform, 
readonly attribute SVGAnimatedEnumeration spreadMethod, 

Y 


interface SVGLinearGradientElement : SVGGradientElement ( 


readonly attribute SVGAnimatedLength x1, 

readonly attribute SVGAnimatedLength y1, 

readonly attribute SVGAnimatedLength x2, 

readonly attribute SVGAnimatedLength y2, 
y 


interface SVGRadialGradientElement : SVGGradientElement 





readonly attribute SVGAnimatedLength cx, 
readonly attribute SVGAnimatedLength cy, 
readonly attribute SVGAnimatedLength r, 
readonly attribute SVGAnimatedLength fx, 
readonly attribute SVGAnimatedLength fy, 


H 


interface SV6StopElement : SVGElement, 
SVöstylable 1 

readonly attribute SVGAnimatedNumber offset, 

y 


interface SV6PatternElement : SVGElement, 
SVGURTReference, 
SVGTests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVöStylable, 
SVGFitToVievBox, 
SVGUnitTypes ( 
readonly attribute SVGAnimatedEnumeration patternünits, 
readonly attribute SVGAnimatedEnumeration patternContentünits, 
readonly attribute SVGAnimatedTransformList patternTransform, 
readonly attribute SVGAnimatedLength x, 
readonly attribute SVGAnimatedLength y, 
readonly attribute SVGAnimatedLength vidth, 
readonly attribute SVGAnimatedLength height, 
y 
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interface SV6ClipPathElement : SVGElement, 
SV6GTests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVöStylable, 
SVGTransformable, 
SVGUnitTypes ( 

readonly attribute SVGAnimatedEnumeration clipPathunits, 





y 

interface SV6MaskElement : SVGElement, 
SVGTests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVGStylable, 


SVGUnitTypes 1 
readonly attribute SVGAnimatedEnumeration maskünits, 
readonly attribute SVGAnimatedEnumeration maskContentüUnits, 
readonly attribute SVGAnimatedLength x, 
readonly attribute SVGAnimatedLength y, 
readonly attribute SVGAnimatedLength vidth, 
readonly attribute SVGAnimatedLength height, 


y 

interface SV6FilterElement : SVGElement, 
SVGURTReference, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVGStylable, 


SVGUnitTypes 1 


readonly attribute SVGAnimatedEnumeration filterUnits, 
readonly attribute SVGAnimatedEnumeration primitiveUnits, 
readonly attribute SVGAnimatedLength x, 

readonly attribute SVGAnimatedLength y, 

readonly attribute SVGAnimatedLength vidth, 

readonly attribute SVGAnimatedLength height, 

readonly attribute SVGAnimatedinteger filterResX, 
readonly attribute SVGAnimatedinteger filterResY, 


void setFilterRes(in unsigned long filterResX, in unsigned long filterResY) raises(DOMException) , 
y 


interface SV6FilterPrimitiveStandardAttributes : SVGStylable ( 
readonly attribute SVGAnimatedLength x, 
readonly attribute SVGAnimatedLength y, 
readonly attribute SVGAnimatedLength vidth, 
readonly attribute SVGAnimatedLength height, 
readonly attribute SVGAnimatedString result, 
Y 


interface SVG6FEBlendElement : SVGElement, 
SVGFilterPrimitiveStandardAttributes 1 


// Blend Mode Types 

const unsigned short SVG FEBLEND MÜDE UNKNOMN c 69, 
const unsigned short SVG FEBLEND MÜDE NORMAL 
const unsigned short SVG FEBLEND MÜDE MÜLTİPL 
const unsigned short SVG FEBLEND MÜDE SCREEN 
const unsigned short SVG FEBLEND MÜDE DARKEN 
const unsigned short SVG FEBLEND MÜDE LTGHTEN - 5, 


z 
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readonly attribute SVGAnimatedString inl, 

readonly attribute SVGAnimatedString in2, 

readonly attribute SVGAnimatedEnumeration mode, 
y 


interface SV6FEColorMatrixElement : SVGElement, 
SVGFilterPrimitiveStandardAttributes 1 


// Color Matrix Types 

const unsigned short SVG FECOLORMATRIX TYPE UNKNOMN c 60, 

const unsigned short SVG FECOLORMATRIX TYPE MATRIX 1, 

const unsigned short SVG FECOLORMATRIX TYPE SATURATE £ 2, 

const unsigned short SVG FECOLORMATRIX TYPE HUEROTATE 3, 

const unsigned short SVG FECOLORMATRIX TYPE LUMINANCETOALPHA £ 4, 





readonly attribute SVGAnimatedString inl, 

readonly attribute SVGAnimatedEnumeration type, 

readonly attribute SVGAnimatedNumberList values, 
y 


interface SV6FEComponentTransferElement : SVGElement, 
SVGFilterPrimitiveStandardAttributes 

readonly attribute SVGAnimatedString inl1, 

y 


interface SV6GComponentTransferFunctionElement : SVGElement ( 


// Component Transfer Types 

const unsigned short SVG FECOMPONENTTRANSFER TYPE UNKNOMN £ 0, 
const unsigned short SVG FECOMPONENTTRANSFER TYPE TDENTTTY z 1, 
const unsigned short SVG FECOMPONENTTRANSFER TYPE TABLE £ 2, 
const unsigned short SVG FECOMPONENTTRANSFER TYPE DITSCRETE z 3, 
const unsigned short SVG FECOMPONENTTRANSFER TYPE LTNEAR c 4, 
const unsigned short SVG FECOMPONENTTRANSFER TYPE GAMMA c 5, 


readonly attribute SVGAnimatedEnumeration type, 
readonly attribute SVGAnimatedNumberList tableValues, 
readonly attribute SVGAnimatedNumber slope, 

readonly attribute SVGAnimatedNumber intercept, 
readonly attribute SVGAnimatedNumber amplitude, 
readonly attribute SVGAnimatedNumber exponent, 
readonly attribute SVGAnimatedNumber offset, 

ii 


interface SV6FEFuncRElement : SVGComponentTransferFunctionElement (f 
Y 


interface SV6FEFuncGElement : SVGComponentTransferFunctionElement (f 
y 


interface SV6FEFuncBElement : SVGComponentTransferFunctionElement (f 
y 


interface SV6FEFuncAElement : SVGComponentTransferFunctionElement (f 
y 


interface SV6FECompositeElement : SVGElement, 
SVGFilterPrimitiveStandardAttributes 1 


// Composite Operators 
const unsigned short SVG FECOMPOSITE OPERATOR UNKNOUN — 0, 
const unsigned short SVG FECOMPOSITE OPERATOR OVER — 1, 

const unsigned short SVG FECOMPOSTTE OPERATOR TN c 2, 
const unsigned short SVG FECOMPOSITE OPERATOR OUT - 
const unsigned short SVG FECOMPOSITE OPERATOR ATOP K 4, 
const unsigned short SVG FECOMPOSITE OPERATOR XOR 5, 












const unsigned short SVG FECOMPOSITE OPERATOR ARITHMETTC — 6, 


readonly attribute SVGAnimatedString inl, 
readonly attribute SVGAnimatedString in2, 
readonly attribute SVGAnimatedEnumeration operator, 
readonly attribute SVGAnimatedNumber k1, 
readonly attribute SVGAnimatedNumber k2, 
readonly attribute SVGAnimatedNumber k3, 
readonly attribute SVGAnimatedNumber k4, 
y 
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interface SV6FEConvolveMatrixElement : SVGElement, 
SVGFilterPrimitiveStandardAttributes 1 


// Edge Mode Values 

const unsigned short SVG EDGEMODE UNKNOVMN - 
const unsigned short SVG EDGEMODE DUPLTCATE 
const unsigned short SVG EDGEMODE VRAP 2, 
const unsigned short SVG EDGEMODE NONE 3, 





readon 
readon 
readon 
readon 


attribute SVGAnimatedString inl, 

attribute SVGAnimatedInteger orderX, 
attribute SVGAnimatedInteger orderY, 
attribute SVGAnimatedNumberList kernelMatrix, 





y 
y 
y 
y 
readonly attribute SVGAnimatedNumber divisor, 
readonly attribute SVGAnimatedNumber bias, 
readonly attribute SVGAnimatedinteger targetX, 
readonly attribute SVGAnimatedIinteger targetY, 
readonly attribute SVGAnimatedEnumeration edgeMode , 
readonly attribute SVGAnimatedNumber kernelUnitLengthX, 
readonly attribute SVGAnimatedNumber kernelUnitLengthY, 
readonly attribute SVGAnimatedBoolean preserveAlpha, 
y 


interface SVGFEDiffuseLightingElement : SVGElement, 
SVöFilterPrimitiveStandardAttributes ( 
readonly attribute SVGAnimatedString inl, 

readonly attribute SVGAnimatedNumber surfaceScale, 

readonly attribute SVGAnimatedNumber diffuseConstant, 

readonly attribute SVGAnimatedNumber kernelUnitLengthX, 

readonly attribute SVGAnimatedNumber kernelUnitLengthY, 

y 


interface SVGFEDistantLightElement : SVGElement 4 
readonly attribute SVGAnimatedNumber azimuth, 
readonly attribute SVGAnimatedNumber elevation, 

y 


interface SV6FEPointLightElement : SVGElement ( 
readonly attribute SVGAnimatedNumber x, 
readonly attribute SVGAnimatedNumber y, 
readonly attribute SVGAnimatedNumber z, 

y 


interface SVGFESpotLightElement : SVGElement 1 





readonly attribute SVGAnimatedNumber x, 

readonly attribute SVGAnimatedNumber y, 

readonly attribute SVGAnimatedNumber z, 

readonly attribute SVGAnimatedNumber pointsAtX, 
readonly attribute SVGAnimatedNumber pointsAtY, 
readonly attribute SVGAnimatedNumber pointsAtZ, 
readonly attribute SVGAnimatedNumber specularExponent , 

y 


readon 


H 


attribute SVGAnimatedNumber limitingConeAngle, 


interface SVGFEDisplacementMapElement : SVGElement, 
SVGFilterPrimitiveStandardAttributes 1 


// Channel Selectors 
const unsigned short SVG CHANNEL UNKNOMN £ 0, 
const unsigned short SVG CHANNEL R 
const unsigned short SVG CHANNEL G 
const unsigned short SVG CHANNEL B 
const unsigned short SVG CHANNEL A 


əə al 


readonly attribute SVGAnimatedString inl1, 

readonly attribute SVGAnimatedString in2, 

readonly attribute SVGAnimatedNumber scale, 

readonly attribute SVGAnimatedEnumeration xChannelselector, 

readonly attribute SVGAnimatedEnumeration yChannelselector, 
y 
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interface SVG6FEFloodElement : SVGElement, 
SVGFilterPrimitiveStandardAttributes 1 
y 


interface SV6FEGaussianBlurElement : SVGElement, 
SVGFilterPrimitiveStandardAttributes ( 


readonly attribute SVGAnimatedString inl, 
readonly attribute SVGAnimatedNumber stdDeviationX, 
readonly attribute SVGAnimatedNumber stdDeviationY, 


void setStdDeviation(in float stdDeviationX, in float stdDeviationY) raises (DOMException) , 





y 

interface SV6FElmageElement : SVGElement, 
SVGURTReference, 
SVGLangSpace, 


SVGExternalResourcesRequired, 

SVGFilterPrimitiveStandardAttributes ( 
readonly attribute SVGAnimatedPreserveAspectRatio preserveAspectRatio, 
Y 


interface SV6FEMergeElement : SVGElement, 
SVGFilterPrimitiveStandardAttributes 1 
y 


interface SVGFEMergeNodeElement : SVGElement 1 
readonly attribute SVGAnimatedString inl, 
y 


interface SVG6FEMorphologyElement : SVGElement, 
SVGFilterPrimitiveStandardAttributes ( 


// Morphology Operators 

const unsigned short SVG MORPHOLOGY OPERATOR UNKNOVMN - 
const unsigned short SVG MORPHOLOGY OPERATOR ERÜODE £ 1, 
const unsigned short SVG MORPHOLOGY OPERATOR DITLATE c 2, 


0, 


readonly attribute SVGAnimatedString inl, 

readonly attribute SVGAnimatedEnumeration operator, 
readonly attribute SVGAnimatedNumber radiusX, 
readonly attribute SVGAnimatedNumber radiusY, 

y 


interface SVGFEOTfsetElement : SVGElement, 
SVGFilterPrimitiveStandardAttributes 1 
readonly attribute SVGAnimatedString inl, 
readonly attribute SVGAnimatedNumber dx, 
readonly attribute SVGAnimatedNumber dy, 





H 


interface SV6FESpecularLightingElement : SVGElement, 
SVGFilterPrimitiveStandardAttributes 1 


readonly attribute SVGAnimatedString inl, 

readonly attribute SVGAnimatedNumber surfaceScale, 
readonly attribute SVGAnimatedNumber specularConstant, 
readonly attribute SVGAnimatedNumber specularExponent , 
readonly attribute SVGAnimatedNumber kernelUnitLengthX, 
readonly attribute SVGAnimatedNumber kernelUnitLengthY, 


H 


interface SVGFETileElement : SVGElement, 

SVGFilterPrimitiveStandardAttributes ( 
readonly attribute SVGAnimatedString inl, 

IR 





interface SV6FETurbulenceElement : SVGElement, 
SVGFilterPrimitiveStandardAttributes ( 


// Turbulence Types 

const unsigned short SVG TURBULENCE TYPE UNKNOMN c 60, 
const unsigned short SVG TURBULENCE TYPE FRACTALNOTSE 
const unsigned short SVG TURBULENCE TYPE TURBULENCE - 


z1: 
2) 


// Stitch Options 
const unsigned short SVG STITCHTYPE UNKNOMN — 0, 
const unsigned short SVG STITCHTYPE STİTCH — 1, 
const unsigned short SVG STITCHTYPE NOSTTTCH - 
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readonly attribute SVGAnimatedNumber baseFrequenceyX, 
readonly attribute SVGAnimatedNumber baseFrequeneyY? 
readonly attribute SVGAnimatedInteger numüctaves, 
readonly attribute SVGAnimatedNumber seed, 

readonly attribute SVGAnimatedEnumeration stitchTiles, 
readonly attribute SVGAnimatedEnumeration type, 


y 

interface SV6CursorElement : SVGElement, 
SVGURTReference, 
SV6GTests, 


SVGExternalResourcesRequired if 
readonly attribute SVGAnimatedLength x, 
readonly attribute SVGAnimatedLength y, 
y 





interface SVGAElement : SVGElement, 
SVGURTReference, 
SVGTests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVöstylable, 
SVGTransformable £ 

readonly attribute SVGAnimatedString target, 

y 


interface SV6GVieuElement : SVGElement, 
SVGExternalResourcesRequired, 
SVGFitToVievBox, 
SVGZoomAndPan 1 

readonly attribute SVGStringList vievTarget, 

y 


interface SV6ScriptElement : SVGElement, 
SVGURTReference, 
SVGExternalResourcesRequired if 
attribute DOMString type setraises(DOMException) , 
y 


interface SV6ZoomEvent : UTEvent 1 
readonly attribute SVGRect zoomRectScreen, 
readonly attribute float previousScale, 
readonly attribute SVGPoint previousTranslate, 
readonly attribute float nevScale, 
readonly attribute SVGPoint nevTranslate, 

y 


interface SVGAnimationElement : SVGElement, 
SV6GTests, 
SVGExternalResourcesRequired, 
ElementTimeControl 1 


readonly attribute SVGElement targetElement, 


Tfloat getStartTime() raises(DÜüMException), 
Tloat getCurrentTime(), 
Tloat getSimpleDuration() raises(DOMException) , 
y 
interface SVGAnimateElement : SVGAnimationElement, 
SVöstylable f 
y 


interface SV6SetElement : SVGAnimationElement (f 
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H 


interface SVGAnimateMotionElement : SVGAnimationElement ( 


H 


interface SV6MPathElement : SVGElement, 


H 


SVGURTReference, 
SVGExternalResourcesRequired ( 


interface SVGAnimateColorElement : SVGAnimationElement, 


H 


SVGStylable 1 


interface SVGAnimateTransformElement : SVGAnimationElement 1 


H 


interface SV6FontElement : SVGElement, 


H 


SVGExternalResourcesRequired, 
SVöstylable 1 


interface SVGGlyphElement : SVGElement, 


H 


SVöstylable 1 


interface SV6MissingGlyphElement : SVGElement, 


H 


SVGstylable 1 


interface SV6HKernElement : SVGElement 1 


H 


interface SV6VKernElement : SVGElement 1 


H 


interface SV6FontFaceElement : SVGElement f 


H 


interface SV6FontFaceSrcElement : SVGElement 1 


H 


interface SV6GFontFaceUriElement : SVGElement 4 


H 


interface SV6FontFaceFormatElement : SVGElement 1 


H 


interface SV6FontFaceNameElement : SVGElement (f 


H 


interface SV6MetadataElement : SVGElement f 


H 


interface SV6ForeignObiectElement : SVGElement, 


readonly attribute 

readonly attribute 

readonly attribute 

readonly attribute 
in 


H 


SV6Tests, 
SVGLangSpace, 
SVGExternalResourcesRequired, 
SVGStylable, 
SVGTransformable 1 
SVGAnimatedLength x, 
SVGAnimatedLength y, 
SVGAnimatedLength vidth, 
SVGAnimatedLength height, 
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Appendix D: lava Language Binding 


Contents 


D.1 The lava language binding 
D.2 Using SVG vvith the lava language 


This appendix is informative, not normative. 


D.1 The lava language binding 


"The lava language binding for the SVG Document Obieet Model definitions is available at: 


http: / /vav .v3.o0rg/TR/2011/REC-SVG11-20110816/7ava-binding.zip 


Note that this language binding is not normative. 1he IDL Definitions are the normative parts of the SVG DOM. 


D.2 Using SVC vvith the lava language 


VVhen seripting SVG vvith a language such as ECMASeript, it is possible to embed script code directly in the SVG 
content using the “script” element and the event attributes (e.g., “onload” or “onclick”). For programming languages 
vvith a binary delivery format, such as the lava language, it is not possible to embed the code into the “script” 
element or vvithin the event attributes. Therefore there is a need to specify hovv such languages can bind to and 
handle events in the SVG document. The follovving technique describes hovv this should be done vvhen using the 
lava language and vvhat is expected of the User Agent that supports dynamic SVG content through the lava lan- 


guage. 
e "The “seript” element should reference a far file containing the compiled code to handle the events fired by the 
document. For example: 
€script typeze"application/fava-archive" xlink:href-z"mylavaHandlers.f1ar"/s 


e "he manifest in the referenced far file contains an entry, SVG-Handler-Class, defining the class responsible 
for initializing the event listeners on the SVG document. The entry should be a fully qualifted class name. For 
example: 


Manifest-Version: 1.1 
SVG-Handler-Class: org.example. svg ..SVHandler 


e "The class referenced by SVG-Handler-Class implements the EventListenerlnitializer interface defined as: 


public interface EventListenerlnitializer ( 


void initializeEventListeners (SVGDocument doc), 


) 


e The method initializeEventListeners() vrill be called by the User Agent before the onload event is triggered. 


"The event binding of other binary programming languages is not specifted. 
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Appendix E: ECMAScript Language Binding 


Contents 


E.1 Exceptions 
E.2 Constants 
E.3 Types 

E.4 Obfects 


This appendix is normative. 


"This appendix describes hovv to expose the SVG DOM to an ECMASeript language environment TECMA-262). 
For descriptions of hovv interfaces and exceptions defined in other specifications are to be exposed to an 
ECMASeript language environment, consult the relevant specification: 


e For DOM Level 2 Core interfaces and exceptions, see the DOM Level 2 Core ECMASeript Language Binding 
appendix (İDOM2), appendix E). 

e For DOM Level 2 Events interfaces, see the DOM Level 2 Events ECMASeript Language Binding appendix 
(İDOM2EVENTSİ, appendix C). 

e For DOM Level 2 Vievvs interfaces, see the DOM Level 2 Vievvs ECMASeript Language Binding appendix 
(İDOMƏəVTEVVS), appendix C). 

e For DOM Level 2 Siyle interfaces, see the DOM Level 2 Style ECMASeript Language Binding appendix 
(İDOM2STYLE), appendix C). 


E.1 Exceptions 


The SVG DOM defines a single exception, SVGException, vvhich is exposed to an ECMASeript language environ- 
ment as follovvs. 

The ECMASeript global obfect has a property named "SVGException" vvhose value is an obiect vvith the fol- 
lovring properties: 


e A read only property named "SVG VRONG TYPE ERR", vvhose value is the Number value 1. 
e A read only property named "SVG TINVALID VALUE ERR", vvhose value is the Number value 2. 
e A read only property named "SVG MATRIX NOT TNVERTABLE", vvhose value is the Number value 3. 


A host obieet that is an SVGException also has these three properties on itself, or somevvhere in its prototype chain. 
Every such host obiect also has a read only property named "code" vvhose value is a Number, corresponding to 
the code exception member on SVGException. 
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E.2 Constants 


For every interface defined in the SVG DOM that has one or more constants defined on it, there exists a property 
on the ECMASeript global obfect vvhose name is the name of the interface, and vvhose value is an obieet vvith a 
read only property for each of the constants. The name of each of these read only properties is the name of the 
corresponding constant, and the value is a Number vvrith the same value as that of the constant. 

A host obiect that implements an interface vvith constants defined on it has, on itself or somevvhere in its 
prototype chain, these properties that correspond to the constants. 


E.3 Types 


The follovving table gives the corresponding ECMASeript type for the IDL primitive types used in the SVG DOM. 


IDL type ECMAScript type 


boolean Boolean 
float Number 
long Number 


unsigned short Number 
unsigned lonq Number 


DOMSiring String 


VVhen an ECMASeript Number is assigned to a property that corresponds to an attribute of an IDL integer type 
(long, unsigned short or unsigned long), or it is passed as an argument passed to an operation for vvhich the ar- 
gument type is an IDL integer type, then behavior is undefined if the Number value is not an integer vvithin the 
range of that type. 

For an interface type, a host obiect that implements the given interface is used. 


E.4 Obiects 


A host obfect that implements a given interface has properties on itself, or in its prototype chain, that correspond 
to the operations and attributes defined on that interface and all its superinterfaces. 

A property that corresponds to an attribute is read only if the attribute is read only, and has a name that is 
the same as the name of the attribute. VVhen getting the property, a value of a type according to the Types section 
above is returned. VVhen setting the property, if it is not read only, then behavior is defined only if a value of a 
type according to the Types section is assigned to it. 

For example, if a is a host obyect that implements the SVGLength interface, then evaluating the statement: 
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a.valueAsString “ "10", 


has defined behavior, but evaluating the statement: 


a.valueAsString 10, 


does not. 

A property that corresponds to an operation has a name that is the same as the name of the operation, and 
has a value that is a Function obfect. The value returned from the Funetion is of a type according to the table in 
the Types section above. VVhen calling the Function, behavior is only defined if the correct number of arguments 
is passed, and the type of each argument is the type according to the Types table. Also, behavior is only defined 
for invoking the Funetion vvith a this value that is equal to the obfect from vvhich the Function vvas obtained. 

For example, if L1 and L2 are tvvo distinct host obyects that implement the SVGPointList interface and p isa 
host ob/ect that implements the SVGPoint interface, then evaluating the follovring statement has defined behavior: 


L1.insertItemBefore(p, 0), 


Evaluating any of the follovving statements, hovvever, does not: 


L1.insertItemBefore(p, "0"), 
L1.insertItemBefore(p, -1), 
L1.insertItemBefore(p, 0.5): 
L1.insertItemBefore(p), 
L1.insertItemBefore(p, 60, 0), 
L1.insertItemBefore(1 x: 10, y: 20 ), 0): 
L1.insertItemBefore.call(11, p, 0), 
L1.insertItemBefore.cal1(L2, p, 0), 
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Appendix F: İmplementation Requirements 


Contents 


F.1 Introduction 
F.2 Error processing 
F.3 Version control 
F.4 Clamping values vvhich are restricted to a particular range 
F.5 “path” element implementation notes 
F.6 Elliptical arc implementation notes 
F.6.1 Elliptical arc syntax 
F.6.2 Out-of-range parameters 
F.6.3 Parameterization alternatives 
F.6.4 Conversion from center to endpoint parameterization 
F.6.5 Conversion from endpoint to center parameterization 
F.6.6 Correction of out-of-range radii 
F.7 Text selection implementation notes 
F.8 Printing implementation notes 


This appendix is normative. 


F.1 Introduction 


"The follovving are notes about implementation requirements corresponding to various features in the SVG lan- 
guage. 


F.2 Error processing 


"There are various scenarios vvhere an SVG document fragment is technically in error: 


ə VVhen the content does not conform to the XML 110 specification PXML10), such as the use of incorrect XML 
syntax 

ə VVhen an element or attribute is encountered in the document vvhich is not part of the SVG DTD and vvhich 
is not properly identified as being part of another namespace (see Namespaces in XML TXML-NSİ)) 

e— VVhen an element has an attribute or property value vvhich is not permissible according to this specification 

e Other situations that are described as being ir error in this specification 


A document can go in and out of error over time. For example, document changes from the SVG DOM or from 
animation can cause a document to become in error and a further change can cause the document to become cor- 
rect again. 
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The follovving error processing shall occur vvhen a document is in error: 


e "Ihe document shall be rendered up to, but not including, the first element vvhich has an error. Exceptions: 

o İfa Ppath” element is the first element vvhich has an error and the only errors are in the path data spe- 
cification, then render the "path” up to the point of the path data error. For related information, see “path” 
element implementation notes. 

o If a ”polyline” or “polygon” element is the first element vvhich has an error and the only errors are vvithin 
the “poinis” attribute, then render the “polyline” or “polygon” up to the segment vvith the error. 

This approach vvill provide a visual clue to the user or developer about vvhere the error might be in the docu- 
ment. 

ə If the document has animations, the animations shall stop at the point at vvhich an error is encountered and 
the visual presentation of the document shall reflect the animated status of the document at the point the 
error vvas encountered. 

e A highly perceivable indication of error shall occur. For visual rendering situations, an example of an indica- 
tion of error vvould be to render a translucent colored pattern such as a checkerboard on top of the area vvhere 
the SVG content is rendered. 

e Ifthe user agent has access to an error reporting capability such as status bar, it is recommended that the user 
agent provide vvhatever additional detail it can to enable the user or developer to quickly find the source of 
the error. For example, the user agent might provide an error message along vvith a line number and character 
number at vvhich the error vvas encountered. 


Because of situations vvhere a block of seripting changes might cause a given SVG document fragment to go into 
and out of error, error processing shall occur only at times vvhen document presentation (e.g., rendering to the 
display device) is updated. m particular, error processing shall be disabled vvhenever redravv has been suspended 
via DOM calls to suspendRedravv. 


F.3 Version control 


The SVG user agent must verify the reference to the PUBLIC identifter in the - IDOCTYPE?- statement or the 
namespace reference in the “xmlns” attribute on the “svg” element to ensure that the given document (or document 
fragment) identifies a version of the SVG language vvhich the SVG user agent supports. If the version information 
is missing or the version information indicates a version of the SVG language vvhich the SVG user agent does 
not support, then the SVG user agent is not required to render that document or fragment. İn particular, it is not 
required that an SVG user agent attempt to render future versions of the SVG language. If the user environment 
provides such an option, the user agent should alert or othervvise notify the user that the version of the file is not 
supported and suggest an alternate processing option (e.g., installing an updated version of the user agent) if such 
an option exists. 

An SVG user agent vvhich supports the SVG Recommendation should alert or othervvise notify the user 
vvhenever it encounters an SVG document (or document fragment) vvhose -c IDOCTYPEs statement or corresponding 
“xmİns” attribute corresponds to a vvorking draft version of the SVG specification. AlI content based on vvorking 
drafts of this specification should be updated to the SVG Recommendation. 
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F.4 Clamping values vvhich are restricted to a particular range 


Some numeric attribute and property values have restricted ranges, such as color component values. VVhen out-of- 
range values are provided, the user agent shall defer any error checking until after presentation time, as compos- 
ited actions might produce intermediate values vvhich are out-of-range but final values vvhich are vvithin range. 

Color values are not in error if they are out-of-range, even if final computations produce an out-of-range 
color value at presentation time. İt is recommended that user agents clamp color values to the nearest color value 
(possibly determined by simple clipping) vvhich the system can process as late as possible (e.g., presentation time), 
although it is acceptable for user agents to clamp color values as early as parse time. Thus, implementation de- 
pendencies might preclude consistent behavior across different systems vvhen out-of-range color values are used. 

Opacity values out-of-range are not in error and should be clamped to the range 0 to 1 at the time vvhich opa- 
city values have to be processed (e.g., at presentation time or vvhen it is necessary to perform intermediate filter 
effect calculations). 


F.5 “path” element implementation notes 


A conforming SVG user agent must implement path rendering as follovvs: 


e Error handling: 

o "Ihe general rule for error handling in path data is that the SVG user agent shall render a “path” element 
up to (but not including) the path command containing the first error in the path data specification. This 
vvill provide a visual clue to the user or developer about vvhere the error might be in the path data spe- 
cification. This rule vvill greatly discourage generation of invalid SVG path data. 

o If a path data command contains an incorrect set of parameters, then the given path data command 
is rendered up to and including the last correctly defined path segment, even if that path segment is a 
sub-component of a compound path data command, such as a "lineto" vvith several pairs of coordinates. 
For example, for the path data string "M 10,10 L 20,20,30", there is an odd number of parameters for the 
"L" command, vvhich requires an even number of parameters. The user agent is required to dravv the 
line from (10.10) to (20,20) and then perform error reporting since "L 20 20" is the last correctly defined 
segment of the path data specification. 

o VVherever possible, all SVG user agents shall report all errors to the user. 

e Markers, directionality and zero-length path segments: 

o İf markers are specifted, then a marker is dravvn on every applicable vertex, even if the given vertex is 
the end point of a zero-length path segment and even if "moveto" commands follovv each other. 

o Certain line-capping and line-ioining situations and markers require that a path segment have direc- 
tionality at its start and end points. Zero-length path segments have no directionality. In these cases, the 
follovving algorithm is used to establish directionality: to determine the directionality of the start point 
of a zero-length path segment, go backvvards in the path data specification vvithin the current subpath 
until you find a segment vvhich has directionality at its end point (e.g., a path segment vvith non-zero 
length) and use its ending direction, othervvise, temporarily consider the start point to lack directional- 
ity. Similarly, to determine the directionality of the end point of a zero-length path segment, go forvvards 
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in the path data specification vvithin the current subpath until you find a segment vvhich has directional- 
ity at its start point (e.g., a path segment vvith non-zero length) and use its starting direction, othervvise, 
temporarily consider the end point to lack directionality. If the start point has directionality but the end 
point doesn"t, then the end point uses the start point"s directionality. If the end point has directionality 
but the start point doesn"t, then the start point uses the end point"s directionality. Othervvise, set the dir- 
ectionality for the path segments start and end points to align vvith the positive x-axis in user space. 

o As mentioned in Stroke Properties, linecaps must be painted for zero length subpaths vvhen “stroke-line- 
cap” has a value of round or square. 

e "Ihe S/s commands indicate that the first control point of the given cubic Bezier segment is caleulated by re- 
flecting the previous path segments second control point relative to the current point. The exact math is as 
follovvs. If the current point is (curx, cury) and the second control point of the previous path segment is (o/dx2, 
oldy2), then the reflected point (i.e., (nevvx1, nev/y1), the first control point of the current path segmenti) is: 


(curx - (oldx2 - curx), cury - (oldy2 - cury)) 
(2“curx - oldx2, 2”cury - oldy2) 


(nevx1, nevy1) 


e A non-positive radius value is an error. 
e Unrecognized contents vvithin a path data stream (i.e., contents that are not part of the path data grammar) 


İs an error. 


F.6 Elliptical arc implementation notes 


F.6.1 Elliptical arc syntax 


An elliptical arc is a particular path command. As such, it is described by the follovving parameters in order: 

(x1, y1) are the absolute coordinates of the current point on the path, obtained from the last tvvo parameters 
of the previous path command. 

rx and ry are the radii of the ellipse (also knovvn as its semi-mafor and semi-minor axes). 

g is the angle from the x-axis of the current coordinate system to the x-axis of the ellipse. 

fə is the large arc flag, and is 0 if an arc spanning less than or equal to 180 degrees is chosen, or 1 if an arc 
spanning greater than 180 degrees is chosen. 

İS is the svveep flag, and is 0 if the line Poining center to arc svveeps through decreasing angles, or 1 if it svveeps 
through increasing angles. 

(x2, y2) are the absolute coordinates of the final point of the arc. 

This parameterization of elliptical arcs vvill be referred to as endpoint parameterization. One of the advant- 
ages of endpoint parameterization is that it permits a consistent path syntax in vvhich all path commands end in 
the coordinates of the nevv "current point". The follovving notes give rules and formulas to help implementers deal 


vvith endpoint parameterization. 
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F.6.2 Out-of-range parameters 


Arbitrary numerical values are permitted for all elliptical arc parameters, but vvhere these values are invalid or 
out-of-range, an implementation must make sense of them as follovvs: 

If the endpoints (xı, yı) and (xə, yə) are identical, then this is equivalent to omitting the elliptical arc segment 
entirely. 

If - 0 or ry - 0 then this arc is treated as a straight line segment (a "lineto") foining the endpoints. 

If rx or ry have negative signs, these are dropped: the absolute value is used instead. 

If rx, ry and g are such that there is no solution (basically, the ellipse is not big enough to reach from (x1, yı) 
to (xə, y2)) then the ellipse is scaled up uniformly until there is exactly one solution (until the ellipse is fust big 
enough). 

q is taken mod 360 degrees. 

Any nonzero value for either of the flags /4 or fs is taken to mean the value 1. 

This forgiving yet consistent treatment of out-of-range values ensures that: 


e "he inevitable approximations arising from computer arithmetic cannot cause a valid set of values vvritten 
by one SVG implementation to be treated as invalid vvhen read by another SVG implementation. This vvould 
othervvise be a problem for common boundary cases such as a semicircular arc. 

e Continuous animations that cause parameters to pass through invalid values are not a problem. The motion 


remains continuous. 


F.6.3 Parameterization alternatives 


An arbitrary point (x, y) on the elliptical arc can be described by the 2-dimensional matrix equation 


x cosq -sinq)) fr, cos9 ö 
i : : LE (F.6.3.1) 
y sino coso 1 İr,sin8 C, 


(cx, cy) are the coordinates of the center of the ellipse. 
rx and ry are the radii of the ellipse (also knovvn as its semi-mafor and semi-minor axes). 
0 is the angle from the x-axis of the current coordinate system to the x-axis of the ellipse. 


Ə ranges from: 


e 6) vvhich is the start angle of the elliptical arc prior to the stretch and rotate operations. 
e 62 vvhich is the end angle of the elliptical arc prior to the stretch and rotate operations. 
e AĞ vvhich is the difference betvveen these tvvo angles. 


If one thinks of an ellipse as a circle that has been stretched and then rotated, then ö), ö2 and AĞ are the start 
angle, end angle and svveep angle, respectively of the arc prior to the stretch and rotate operations. This leads to an 
alternate parameterization vrhich is common among graphics APIs, vvhich vvill be referred to as center parameter- 
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ization. In the next sections, formulas are given for mapping in both directions betvveen center parameterization 


and endpoint parameterization. 
F.6.4 Conversion from center to endpoint parameterization 


Given the follovving variables: 
Cx Oy (x ry 0 Öl) AĞ 
the task is to find: 
x yı x2 y2 /A İS 
This can be achieved using the follovving formulas: 



































”i cosq? -sino) fr, cos9:) İc, 

iL cosg 0. ic) (F.6.4.1) 

Xə cos -sinq) fr, cos (9) 4 A0) əş 

Və, R sino cosq? : r, sin (9) 4. A0) “. ö, (F.6.4.2) 

F -İ. if IA9l 5 180” 

A (0 if IA6l x 180” (F.6.4.3) 

f m” 277 (F.6.4.4) 
0 if Ağ o 0? 


F.6.5 Conversion from endpoint to center parameterization 


Given the follovving variables: 
xı yı x yı /A fS rx ry g 
the task is to find: 
Cx cy Ül, AQ 
The equations simplify after a translation vvhich places the origin at the midpoint of the line Toining (xı, yı) 
to (xə, yə), follovved by a rotation to line up the coordinate axes vvith the axes of the ellipse. AİI transformed co- 
ordinates vvill be vvritten vvith primes. They are computed as intermediate values on the vvay tovvard finding the 
required center parameterization variables. This procedure consists of the follovving steps: 


e Step 1: Compulte (xV, yı) 
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, : 5 
Xı cosq? sinq? 2 
,pD . ı Mə (F.6.5.1) 
Y, —sinq coso .... 
əv Step 2: Compute (cx, cy) 
irz — rev." — r/ix." xYy 
rxr, — rx(V)) — fy(X)) ”y 
2 “5 p) .. a (F.6.5.2) 
r.(Y))” £ r,(x?) - çe 
vvhere the -. sign is chosen if /4 z fs, and the - sign is chosen if f4 - fs. 
e Step 3: Compute (cx, ey) from (ex", ey)) 
ı , X1 TxXxəŞ 
ck cosq -sinoi İCcx 
“. . . rl F yi Ey (F.6.5.3) 
sinqə cosop) İc, ıyyə 


e Sfep 4: Compute öl and Ağ 
In general, the angle betvveen tvvo vectors (tz, iy) and (yy, vy) can be computed as 


2 lü, v) — x arccos zl 1”1 üzə 


vvhere the “ sign appearing here is the sign of ix Vy - /y Vi. 
This angle function can be used to express Ö) and AĞ as follovvs: 








x — EP 
1 x 
0. - , (F.6.5.5) 
1 , p... , 6.5. 
Ol İY) “C, 
y 
XV -— əş —X" — E 
r ry 
A 90 - £R / ,İ, , , mod 360” (F.6.5.6) 
Yı” ey 1 17Yı 
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vvhere Öl) is fixed in the range -360” - Ağ - 360” such that: 
if £s - 0, then AĞ - 0, 
else if fs - 1, then A6 x 0. 
m other vvords, if fs - 0 and the right side of (F.6.5.6) is greater than 0, then subtract 360”, vvhereas if 
8 - 1.and the right side of (F.6.5.6) is less than 0, then add 360”. In all other cases leave it as is. 


F.6.6 Correction of out-of-range radii 


"his section formalizes the adiustments to out-of-range rx and ry mentioned in F.6.2. Algorithmically these adfust- 
ments consist of the follovving steps: 


e Step 1: Ensure radii are non-zero 

If rk - 0 or ry - 0, then treat this as a straight line from (xı, yı) to (xə, yə) and stop. Othervvise, 
e Step 2: Ensure radii are positive 

Take the absolute value of rx and ry: 


FE” IR r iryl (F.6.6.1) 


e Sfep 3: Ensure radii are large enough 
Using the primed coordinate values of equation (F.6.5.1), compute 


“2 "2 
X y 
A - L) z. L) (F.6.6.2) 
rx ry 





If the result of the above equation is less than or equal to 1, then no further change need be made to rx and 
ry, If the result of the above equation is greater than 1, then make the replacements 


r, “ VAr, r m VAT, (F.6.6.3) 


e Step 4: Proceed vvith computations 
Proceed vvith the remaining elliptical arc computations, such as those in section F.6.5. Note: As a con- 
sequence of the radii corrections in this section, equation (F.6.5.2) for the center of the ellipse alvrays has at 
least one solution (i.e. the radicand is never negative). In the case that the radii are scaled up using equation 
(F.6.6.3), the radicand of (F.6.5.2) is zero and there is exactly one solution for the center of the ellipse. 


F.7 Text selection implementation notes 


The follovving implementation notes describe the algorithm for deciding vvhich characters are selected during a 


text selection operation. 
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As the text selection operation occurs (e.g., vvhile the user clicks and drags the mouse to identify the selec- 
tion), the user agent determines a sfarf selection position and an end selection position, each of vvhich represents 
a position in the text string betvveen tvvo characters. After determining start selection position and end selection 
position, the user agent selects the appropriate characters, vvhere the resulting text selection consists of either: 


e no selection or 
e a start character, an end character (possibly the same character), and all of the characters vvithin the same 
“text” element vvhose position in the DOM is logically betvveen the start character and end character. 


On systems vrith pointer devices, to determine the sfarf selection position, the SVG user agent determines vvhich 
boundary betvveen characters corresponding to rendered glyphs is the best target (e.g., closest) based on the cur- 
rent pointer İocation at the time of the event that initiates the selection operation (e.g., the mouse dovvn event). 
"The user agent then tracks the completion of the selection operation (e.g., the mouse drag, follovved ultimately by 
the mouse up). At the end of the selection operation, the user agent determines vvhich boundary betvveen charac- 
ters is the best target (e.g., closest) for the end selection position. 

If no character reordering has occurred due to bidirectionality, then the selection consists of all characters 
betvveen the sfarf selection position and end selection position. For example, if a “text” element contains the string 
"abedef" and the start selection position and end selection positions are 0 and 3 respectively (assuming the left side 
of the "a" is position zero), then the selection vvill consist of "abc". 

VVhen the user agent is implementing selection of bidirectional text, and vvhen the selection starts (or ends) 
betvveen characters vvhich are not contiguous in logical order, then there might be multiple potential combinations 
of characters that can be considered part of the selection. The algorithms to choose among the combinations of 
potential selection options shall choose the selection option vvhich most closely matches the text string/s visual 
rendering order. 

VVhen multiple characters map inseparably to a given set of one or more gİyphs, the user agent can either 
disallovv the selection to start in the middle of the glyph set or can attempt to allocate portions of the area taken 
up by the glyph set to the characters that correspond to the giyph. 

For systems vvhich support pointer devices such as a mouse, the user agent is required to provide a mechanism 
for selecting text even vvhen the given text has associated event handlers or links, vvhich might block text selection 
due to event processing precedence rules (see Pointer events). One implementation option: For platforms vvhich 
support a pointer device such as a mouse, the user agent may provide for a small additional region around charac- 
ter cells vvhich initiates text selection operations but does not initiate event handlers or links. 


F.S Printing implementation notes 


For user agents vvhich support both zooming on display devices and printing, it is recommended that the default 
printing option produce printed output that reflects the display device"s current vievv of the current SVG document 
fragment (assuming there is no media-specific styling), taking into account any zooming and panning done by the 
user, the current state of animation, and any document changes due to DOM and seripting. Thus, if the user zooms 
into a particular area of a map on the display device and then requests a hardcopy, the hardcopy should shovv the 
same vievv of the map as appears on the display device. İf a user pauses an animation and prints, the hardcopy 
should shovv the same graphics as the currently paused picture on the display device. İf seripting has added or 


removed elements from the document, then the hardcopy should reflect the same changes that vvould be reflected 
on the display. 

VVhen an SVG document is rendered on a static-only device such as a printer vvhich does not support SVG"s 
animation and scripting and facilities, then the user agent shall ignore any animation and scripting elements in 
the document and render the remaining graphics elements according to the rules in this specification. 
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Appendix G: Conformance Criteria 


Contents 


G.1 Introduction 

G.2 Conforming SVG Document Fragments 
G.3 Conforming SVG Stand-Alone Files 
G.4 Conforming SVG Generators 

G.5 Conforming SVG Servers 

G.6 Conforming SVG DOM Subtree 

G.7 Conforming SVG Interpreters 

G.8 Conforming SVG Vievvers 


This appendix is normative. 


G.1 İntroduction 


m order to ensure that SVG-family documents are maximally portable among SVG-family user agents, this spe- 
cification rigidly defines conformance requirements for both, as vvell as for SVG-family document types. VVhile 
the conformance definitions can be found in this appendix, they necessarily reference normative text vvithin this 
document and vvithin other related specifications. İt is only possible to fully comprehend the conformance require- 
ments of SVG through a complete reading of all normative references. 


G.2 Conforming SVG Document Fragments 


An SVG document fragment is a Conforming SVG Document Fragment if it adheres to the specification described 
in this document (Scalable Vector Graphics (SVG) Specification) and also: 


e is XML vvell-formed (TXML10), section 2.1), 
e conforms to the Namespaces in XML specification PTXML-NSİ, 
e any CSS stylesheets conform to the core grammar of Cascading Style Sheets, level 2 (CSS2), 
e any -?xml-stylesheet?x processing instruction conforms to Associating stylesheets vvith XML documents 
DAML-SSİ, 

e and the document fragment is determined to be valid as follovvs: 

1. Let E be the encoding of the XML document in vvhich the SVG document fragment resides. 

2. Let V be the XML version of the document in vvhich the SVG document fragment resides. 

3. Let D be an XML document constructed by concatenating: 

"an XML declaration identifying version V and encoding E (that is, c?xml version-"V" encodin- 
g-"E"?ə), 
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"— the DOCTYTE declaration - DOCTYPE svg PUBLİC "-//0/3C/ /DTD SVG 1.1//EN" SYSTEM "ht- 
tp://uvv .v/3.org/Graphics/SVG/1.1/DTD/svg11.dtd"x, and 
" the SVG document fragment vvith any entities expanded. 
4. Remove from D any subtree rooted by an element that is not in the SVG namespace. 
Remove from Do any attribute that is in a namespace that is not the XLink namespace or the Namespaces 
in XML namespace. 
6. Remove the prefix from the name of any element in D that uses one. 
7. Let A be the set of all attributes in D that are in the XLink namespace. 
8. Set the attributes xmlns-"http://vrvvvr.vv3.org/2000/svg" and xmlİns:xlink-"http://vvvvvv.vv3.org/1999/xlink" 
on Dis document element and remove any other attributes in the Namespaces in XML namespace from 
D. 
9. Change the prefix of every attribute A to be xlink. 
10. The document fragment is valid if Dis a valid XML document (İXML10İ, section 2.8). 


SVG document fragments can be included vvithin parent XML documents using the XML namespace facilities 
deseribed in Namespaces in XML IXML-XSI. Note, hovvever, that since a Conforming SVG Document Fragment 
must have an “svg” element as its root, the use of an individual non-“svg” element from the SVG namespace is dis- 
allovved. Thus, the SVG part of the follovring document is nof conforming: 


€?xml versionze"1.0" standalonez"no"?s 
cDOCTYPE SomeParentXMLGrammar PUBLİC "-//SomeParent" "http://SomeParentXMLGramnar.dtd"s 
xParentXML” 

c1-- Elements from ParentXML go here --s 

c1-- The folloving is not conforming --x 

eZ:rect xmlns:ze"http:/ /vuv.v3.org/2000/svg" 

xze"0" y-"0" vidth-"10" height-"10" / 

c1-- More elements from ParentXML go here --x 

e/ ParentXML- 


Imstead, for the SVG part to become a Conforming SVG Document Fragment, the file could be modifted as follovvs: 


c?xml versionze"1.0" standalonez"no"?s 
cIDOCTYPE SomeParentXMLGrammar PUBLİC "-//SomeParent" "http://SomeParentXMLGramnar.dtd"s 
xParentXMLe 
c1-- Elements from ParentXML go here --s 
c1-- The folloving is conforming --x 
xZ:SVg xmlns:ze"http: / /vvMv.v3.org/2000/svg" 
vidth-"100px" height-"100px"- 
xz:rect xe"0" y-"0" vidth-"10" height-"10"/5 
x/Z:SVg” 
c1-- More elements from ParentXML go here --x 
e/ ParentXML- 


The SVG language or these conformance eriteria provide no designated size limits on any aspect of SVG content. 
There are no maximum values on the number of elements, the amount of character data, or the number of charac- 
ters in attribute values. 
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G.3 Conforming SVC Stand-Alone Files 


A file is a Conforming SVG Stand-Alone File if: 


e it is an XML document, 
e its root element is an “svg” element, and 
e the SVG document fragment rooted at the document element is a Conforming SVG Document Fragment. 


G.4 Conforming SVC Generators 


A Conforming SVG Generator is a program vvhich: 


e alvvays creates Conforming SVG Document Fragments and/or Conforming SVG Stand-Alone Files. 
e does not create non-conforming SVG document fragments of the above types. 


Additionally, an authoring tool vvhich is a Conforming SVG Generator conforms to all of the Priority 1 accessibil- 
ity guidelines from the document Aufhoring Tool Accessibility Guidelines 1.0 LATAGİ that are relevant to gener- 
ators of SVG content. (Priorities 2 and 3 are encouraged but not required for conformance.) 

SVG generators are encouraged to follovv VV3C developments in the area of internationalization. Of particular 
interest is the V/3C Character Model and the concept of YV/ebvvide Early Uniform Normalization, vvhich promises 
to enhance the interchangability of Unicode character data across users and applications. Future versions of the 
SVG specification are likely to require support of the V/3C Character Model in Conforming SVG Generators. 


G.5 Conforming SVC Servers 


Conforming SVG Servers must meet all the requirements of a Conforming SVG Generator. In addition, Conform- 
ing SVG Servers using HTTP or other protocols that use Internet Media types must serve SVG stand-alone files 
vvith the media type "image/svg-xml". 

Also, if the SVG file is compressed vvith gzip or deflate, Conforming SVG Servers must indicate this vvith the 
appropriate header, according to vvhat the protocol supports. Specifically, for content compressed by the server 
immediately prior to transfer, the server must use the "TIransfer-Encoding: gzip" or "Transfer-Encoding: deflate" 
headers as appropriate, and for content stored in a compressed format on the server (e.g. vvith the file extension 
"svgz"), the server must use the "Content-Encoding: gzip" or "Content-Encoding: deflate" headers as appropriate. 

Note: Compression of stored content (the "entity,/" in HTTP terms) is distinct from automatic compression of 
the message body, as defined in HTTP/1.1 TE/ Transfer Encoding (İRFC2616), sections 14.39 and 14.41). 


G.6 Conforming SVC DOM Subtree 


A DOM subtree rooted at a given element is a Conforming SVG DOM Subtree if, once serialized to XML, is a Con- 
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forming SVG Document Fragment. If the DOM subtree cannot be serialized to XML, such as vvhen a Comment 
nodes data contains the substring "—-", then the subtree is not a Conforming SVG DOM Subtree. 


G.7 Conforming SVC Interpreters 


An SVG interpreter is a program vvhich can parse and process SVG document fragments. Examples of SVG in- 
terpreters are server-side transcoding tools (e.g., a tool vvhich converts SVG content into modified SVG content) 
or analysis tools (e.g., a tool vvhich extracts the text content from SVG content). An SVG vievver also satisfies the 
requirements of an SVG interpreter in that it can parse and process SVG document fragments, vvhere processing 
consists of rendering the SVG content to the target medium. 

m a Conforming SVG Interpreter, the XML parser must be able to parse and process all XML constructs 
defined vvithin XML 1.0 İXML10) and Namespaces in XML İXML-NSI. 

There are tvvo sub-categories of Conforming SVG İnterpreters: 


e Conforming Static SVG Interpreters must be able to parse and process the static language features of SVG that 
correspond to the feature string "http:/ /vrvvvv.vv3.org/TR/SVG11/features5SVG-static" (see Feature strings). 

e İn addition to the requirements for the static category, Conforming Dynamic SVG İInterpreters must be able 
to parse and process the language features of SVG that correspond to the feature string "http://vvvvvv.vv3.org/ 
TR/SVG11/featureiSVG-dynamic" (see Feature strings) and vvhich support all of the required features in the 
SVG DOM deseribed in this specification. 


A Conforming SVG Tnterpreter must parse any SVG document correctly. It is not required to interpret the se- 
mantics of all features correctly. 

Note: A transeoder from SVG into another graphics representation, such as an SVG-to-raster transcoder, rep- 
resents a vievver, and thus vievver conformance eriteria apply. (See Conforming SVG Vievvers.) 


G.S Conforming SVC Vievvers 


An SVG vievver is a program vvhich can parse and process an SVG document fragment and render the contents of 
the document onto some sort of output medium such as a display or printer, thus, an SVG Vievver is also an SVG 
İnterpreter. 

There are tvvo sub-categories of Conforming SVG Vievvers: 


e Conforming Static SVG Vievvers support the static language features of SVG that correspond to the feature 
string "http://vvvvvv.vv3.org/TR/SVG11/feature/SVG-static" (see Feature strings). This category often corres- 
ponds to platforms and environments vvhich only render static documents, such as printers. 

e Conforming Dynamic SVG Vievvers support the language features of SVG that correspond to the feature 
string "http://vvvvvv.vv3.org/ TR/SVG11/featurezSVG-dynamic" (see Feature strings). This category often ap- 
plies to platforms and environments such as common VVeb brovvsers vvhich support user interaction and dy- 
namic document content (i.e., documents vvhose content can change over time). (User interaction includes 
support for hyperlinking, events İe.g., mouse clicksl, text selection, zooming and panning İsee Interactivityl. 


Dynamic document content can be achieved via declarative animation or by seripts modifying the SVG 
DOM.) 


Specific eriteria that apply to both Conforming Static SVG Vievvers and Conforming Dynamic SVG Vievvers: 
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e "he program must also be a Conforming SVG Interpreter, 

e For interactive user environmenis, facilities must exist for zooming and panning of stand-alone SVG docu- 
ments or SVG document fragments embedded vvithin parent XML documents. 

e İn environments that have appropriate user interaction facilities, the vievver must support the ability to ac- 
tivate hyperlinks. 

e If printing devices are supported, SVG content must be printable at printer resolutions vvith the same graphics 
features available as required for display (e.g., the specified colors must be rendered on color printers). 

e On systems vvhere this information is available, the parent environment must provide the vievver vvith in- 





formation about physical device resolution. In situations vvhere this information is impossible to determine, 
the parent environment shall pass a reasonable value for device resolution vvhich tends to approximate most 
common target devices. 

e "Ihe vievver must support IPEG and PNG image formats TİPEGİ İTPNG). 

e Resampling of image data must be consistent vvith the specification of property “image-rendering”. 

e "The vievver must support alpha channel blending of the image of the SVG content onto the target canvas. 

e SVG implementations must correctly support gzip-encoded İRFC19521 and deflate-encoded TRFC1951) data 
streams, for any content type (including SVG, seript files, images). SVG implementations that support HTTP 
must support these encodings according to the HTTP 1.1 specification İRFC2616): in particular, the client 
must specify vvith an "Accept-Encoding:" request header (HTTP-ACCEPT-ENCODINGİ those encodings that 
it accepts, including at minimum gzip and deflate, and then decompress any gzip-encoded and deflate-en- 
coded data streams that are dovvnloaded from the server. VVhen an SVG vievver retrieves compressed content 
(e.g., an .svgz file) over HTTP, if the "Content-Encoding" and "Transfer-Encoding" response headers are miss- 
ing or specify a value that does not match the compression method that has been applied to the content, then 
the SVG vievver must not render the content and must treat the document as being in error. 

e "he vievver must support base64 encoded content using the "data:" URL scheme İRFC2397) vvherever URİT ref- 
erencing of vvhole documents (such as raster images, SVG documents, fonts and color profiles) is permitted 
vvithin SVG content. (Note: fragments of SVG content vrhich do not constitute an entire SVG document are 
not available using the "data:" URL scheme.) 

e "Ihe vievver must support the follovving VV3C Recommendations vrith regard to SVG content: 

o complete support for the XML 10 specification PXML101. 

o complete support for inclusion of non-SVG namespaces vvithin SVG content as defined in Namespaces 
in XML IXML-NSI. (Note that data from non-SVG namespaces are included in the DOM but are other- 
vvise ignored.) 

e All visual rendering must be accurate to vvithin one device pixel (px unit) to the mathematically correct result 
at the initial 1:1 zoom ratio. İt is suggested that vievvers attempt to keep a high degree of accuracy vvhen 
zooming. 

e On systems vvhich support accurate sRGB (SRGB) color, all sRGB color computations and all resulting color 
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values must be accurate to vvithin one sRGB color component value, vvhere sRGB color component values 
range from 0 to 255. 


Although anti-aliasing support is not a strict requirement for a Conforming SVG Vievver, it is highly recommended 
for display devices. Lack of anti-aliasing support vvill generally result in poor results on display devices. 
Specific eriteria that apply to only Conforming Dynamic SVG Vievvers: 


e In VVeb brovvser environments, the vievver must have the ability to search and select text strings vvithin SVG 
content. 

e If display devices are supported, the vievver must have the ability to select and copy text from SVG content 
to the system clipboard. 

e “Ihe vievver must have complete support for an ECMASeript binding of the SVG Document Obiect Model 
İECMA-262l. 


"The VVeb Accessibility Initiative is defining User Agenf Accessibility Guidelines 1.0 ÜUAAGİ. Vievvers are encour- 
aged to conform to the Priority 1 accessibility guidelines defined in this document, and preferably also Priorities 2 
and 3. Once the guidelines are completed, a future version of this specification is likely to require conformance to 
the Priority 1 guidelines in Conforming SVG Vievvers. 

A higher order concept is that of a Conforming High-Quality SVG Vievver, vrith sub-categories Conforming 
High-Quality Static SVG Vievver and Conforming High-Quality Dynamic SVG Vievver. 

Both a Conforming High-Quality Static SVG Vievver and a Conforming High-Quality Dynamic SVG Vievver 
must support the follovving additional features: 


e Professional-quality results vvith good processing and rendering performance and smooth, flicker-free anim- 
ations. 

e On lovv-resolution devices such as display devices at 150dpi or less, support for smooth edges on lines, curves 
and text. (Smoothing is often accomplished using anti-aliasing techniques.) 

e Color management via ICC profile support (i.e., the ability to support colors defined using ICC profiles). 

e Resampling of image data must conform to the requirements for Conforming High-Quality SVG Vievvers as 
specifted in the description of property “image-rendering”. 

e At least double-precision floating point computation on coordinate system transformation numerical calcu- 
lations. 


A Conforming High-Quality Dynamic SVG Vievver must support the follovving additional features: 


e Progressive rendering and animation effects (i.e., the start of the document vvill start appearing and anima- 
tions vvill start running in parallel vvith dovvnloading the rest of the document). 

e Restricted screen updates (i.e., only required areas of the display are updated in response to redravv events). 

e Background dovvnloading of images and fonts retrieved from a VVeb server, vvith updating of the display once 
the dovvnloads are complete. 


A Conforming SVG Vievver must be able to apply styling properties to SVG content using presentation attributes. 
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If the user agent supports Cascading Style Sheets, level 2 TCSS2), a Conforming SVG Vievver must support 
CSS styling of SVG content and must support all features from CSS2 that are described in this specification as 
applying to SVG (see properties shared vvith CSS and XSL, Styling vvith CSS and Facilities from CSS and XSL used 
by SVG). The supported features from CS52 must be implemented in accordance vvith the conformance definitions 
from the CSS2 specification (İCSS2), section 3.2). 

If the user agent includes an HTML or XHTML vievving capability or can apply CSS/XSL styling properties 
to XML documents, then a Conforming SVG Vievver must support resources of MIME type "image/svgixml" 
vvherever raster image external resources can be used, such as in the HTML or XHTML “img” element and in CSS/ 
XSL properties that can refer to raster image resources (e.g., background-image”). 
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Appendix H: Accessibility Support 


Contents 


H.1VVAI Accessibility Guidelines 
H.2 SVG Content Accessibility Guidelines 


This appendix is informative, not normative. 


H.1VVAI Accessibility Guidelines 


This appendix explains hovv accessibility guidelines published by VV3C"s VVeb Accessibility Initiative (VVAT) appİiy 
to SVG. 


1. The Veb Content Accessibility Guidelines (V/CAG) 2.0 (V/CAG2) explains hovv authors can create VVeb con- 
tent that is accessible to people vvith disabilities. 

2. The Aufhoring Tool Accessibility Guidelines 1.0 LATAĞG) explains hovv developers can design accessible au- 
thoring tools such as SVG authoring tools. To conform to the SVG specification, an SVG authoring tool must 
conform to ATAG (priority 1). SVG support for element grouping and reuse is relevant to designing accessible 
SVG authoring tools. 

3. "he User Agent Accessibility Guidelines 1.0 TUAAGİ explains hovv developers can design accessible user 
agents such as SVG-enabled brovvsers. To conform to the SVG specification, an SVG user agent should con- 
form to UAAG. SVG support for scaling, style sheets, the DOM, and metadata are all relevant to designing 
accessible SVG user agents. 


The VV3C Note Accessibility Features of SVG ISVG-ACCESS) explains in detail hovv the requirements of the three 
guidelines apply to SVG. 


H.2 SVG Content Accessibility Guidelines 


"This section explains briefly hovv authors can create accessible SVG documents: it summarizes Accessibility 
Features of SVG ISVG-ACCESSİ. 


Provide text equivalents for graphics. 


e VVhen the text content of a graphic (e.g., in a “text” element) explains its function, no text equivalent is 
required. Use the “title” child element to explain the function of “text” elements vvhose meaning is not 
clear from their text content. 

ə VVhen a graphic does not include explanatory text content, it requires a text equivalent. If the equivalent 
is complex, use the “desc” element, othervvise use the “title” child element. 
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e If a graphic is built from meaningful paris, build the description from meaningful paris. 
Do not rely on color alone. 


ə Do not use color alone to convey information. 
ə Ensure adequate color contrast. Use style sheets so that users vvho require certain color combinations 


may appİy them through user style sheets. 
Use markup and style sheets and do so properly. 


ə Represent text as character data, not as images or curves. Style text vvith fonts. Authors may describe 
their ovvn fonts in SVG. 

ə Separate structure from presentation. 

e Use the “g” element and rich descriptions to structure SVG documents. Reuse named obiects. 

ə Publish highly-structured documents, not fust graphical representations. Documents that are rich in 
structure may be rendered graphically, as speech, or as braille. For example, express mathematical rela- 
tionships in MathML (MATHMLİI and use SVG for explanatory graphics. 

e Author documenits that validate to the SVG grammar. 

ə Use style sheets to specify graphical and aural presentation. 

e Use relative units in style sheets. 


Clarify natural language usage. 
e Use “xml-lang” to identify the natural language of content and changes in natural language. 
Ensure that dynamic content is accessible. 


ə Ensure that text equivalents for dynamic content are updated vrhen the dynamic content changes. 
ə Ensure that SVG documents are usable vvhen scripts or other programmatic obiects are turned off or 


not supported. 
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Appendix l: İnternationalization Support 


Contents 


L1 mtroduction 
12 mternationalization and SVG 
13 SVG Internationalization Guidelines 


This appendix is informative, not normative. 


lI.1 İntroduction 


"This appendix provides a brief summary of SVG"s support for internationalization. The appendix is hyperlinked to 
the sections of the specification vvhich elaborate on particular topics. 


I.2 Internationalization and SVG 


SVG is an application of XML (TXML101 and thus supports Unicode TUNICODE), vrhich defines a standard univer- 
sal character set. 

Additionally, SVG provides a mechanism for precise control of the glyphs used to dravv text strings, vvhich is 
described in Alternate glyphs. This facility provides: 


e the ability to specify the rendering of particular glyphs vvhich might not be accessible vvhen defining charac- 
ter data using Unicode 

e the ability to override the user agent/s character-to-giyph algorithms 

e the ability to follovv the guidelines for normalizing character data for the purposes of enhanced interoperabil- 
ity (see Character Model for the Vyorld VVide Vveb 1.0: Fundamentals ITCHARMOD)), vrhile still having precise 
control over the gİyphs that are dravvn. 


SVG supporits: 


e Horizontal, left-to-right text found in Roman seripts (see the “vrriting-mode” property) 
e Vertical and vertical-ideographic text (see the “vriting-mode” property) 
e Bidirectional text (for languages such as Arabic and Hebrevv - see the “direction” and “unicode-bidi” properties) 


SVG fonts support contextual giyph selection for Arabic and Han text. 
Multi-language SVG documents are possible by utilizing the “systemLanguage” attribute to have different text 
strings appear based on the client machine"s language setting. 


1.3 SVC Internationalization Guidelines 


SVG generators should follovv VV3C guidelines for normalizing character data (CHARMODİ. VVhen precise control 
over giyph selection is required, use the facilities for Alternate glyphs to override the user agent/s character-to- 
giyph mapping algorithms. 
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Appendix 1: Minimizing SVC File Sizes 


This appendix is informative, not normative. 


Considerable effort has been made to make SVG file sizes as small as possible vvhile still retaining the beneftts of 
XML and achieving compatibility and leverage vvith other VV3C specifications. 
Here are some of the features in SVG that promote small file sizes: 


e SVG:s path data definition vvas defined to produce a compact data stream for vector graphics data: all com- 
mands are one character in length: relative coordinates are available, separator characters do not have to be 
supplied vvhen tokens can be identifted implicitly: smooth curve formulations are available (cubic Beziers, 
quadratic Böziers and elliptical arcs) to prevent the need to tesselate into polylines, and shortcut formulations 
exist for common forms of cubic Bezier segments, quadratic Bözier segments, and horizontal and vertical 
straight line segments so that the minimum number of coordinates need to be specifted. 

e "Text can be specifted using XML character data — no need to convert to outlines. 

ə SVG contains a facility for defining symbols once and referencing them multiple times using different visual 
attributes and different sizing, positioning, clipping and client-side filter effects 

e User agents that support styling vvith CSS can use CSS selectors and property inheritance to define commonly 
used sets of attributes once as named styles. 

e Filter effects allovv for compelling visual results and effects typically found only in image-authoring tools us- 
ing small amounts of vector and/or raster data 


Additionally, HTTP/1.1 allovvs for compressed data to be passed from server to client, vvhich can result in signi- 
ficant file size reduction. Here are some sample compression results using gzip compression on SVG documents 
İRFC1952l: 


Uncompressed SVG /VVith gzip compression Compression ratio 





12,912 2,463 8176 
12,164 2,553 7976 
11,613 2,617 7770 
18,689 4,077 7876 
13,024 2,041 8476 


A related issue is progressive rendering. Some SVG vievvers vvill support: 


e the ability to display the first parts of an SVG document fragments as the remainder of the document is 


dovvnloaded from the server, thus, the user vvill see part of the SVG dravving right avvay and interact vvith it, 
even if the SVG file size is large. 

e delayed dovvnloading of images and fonts. Tust like some HTML brovvsers, some SVG vievvers vvill dovvnload 
images and VVebFonts (TCSS2), section 15.1) last, substituting a temporary image and system fonts, respect- 
ively, until the given image and/or font is available. 
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Here are techniques for minimizing SVG file sizes and minimizing the time before the user is able to start interact- 
ing vvith the SVG document fragments: 


e Construct the SVG file such that any links vvhich the user might vvant to click on are included at the beginning 
of the SVG file 

e Use default values vyhenever possible rather than defining all attributes and properties explicitly. 

e Take advantage of the path data data compaction facilities: use relative coordinates, use Ph and vfor horizontal 
and vertical lines, use s or £ for cubic and quadratic Bezier segments vvhenever possible: eliminate extraneous 





vvhite space and separators. 

e Utilize symbols if the same graphic appears multiple times in the document 

ə For user agents that support styling vvith CSS, utilize CSS property inheritance and selectors to consolidate 
commonly used properties into named styles or to assign the properties to a parent “g element. 

e Utilize filter effects to help construct graphics via client-side graphics operations. 
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15948:2003 (E), D. Duce, ed. VVorld VVide VVeb Consortium, 10 November 2003. 
"This edition of PNG is http:/ /vrvvvv.vv3.org/ TR/2003/REC-PNG-20031110/. 
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İPORTERDUFFİ) 
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IRFC1951) 
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Available at http:/ /vrvvvv.ietf.org/Tfc/rfe1951.txt. 
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GZİP file format specification version 4.3, P. Deutsch, May 1996. 
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Key vvords for use in RFCs to İndicate Requirement Levels, S. Bradner, March 1997. 
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IRFC2318) 
The text/css Media Type, H. Lie, B. Bos, C. Lilley, March 1998. 
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The "data" URL scheme, L. Masinter, August 1998. 
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IRFC2616) 
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UTF-8, a transformation format of 1SO 10646, F. Yergeau, November 2003. (Note that this RFC obsoletes 
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Available at http://vvvvvv.ietf.org/rfc/rfe3629.txt. 
IRFC3986) 
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(Note that RFC 3986 updates RFC 1738 and obsoletes RFC 2732, RFC 2396 and RFC 1808.) 
Available at http://tools.ietf.org/html/rfe3986. 
IRFC3987) 
Internationalized Resource Identifters (IRIs), M. Dürst, M. Suignard, Tanuary 2005. 
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"The latest edition of SMIL Animation is available at http://vvvvvv.vv3.org/ TR/smil-animation/. 
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See also http:/ /vvvvvv.color.org/chardata/rgb/srgb.xalter for technical data and color profiles. 
TUAX9) 
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TUNICODE) 
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İXLINKI 
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VVeb Consortium, 06 May 2010. 
"This edition of XLink 1.1 is http://vvvvvv.vv3.org/ TR/2010/REC-xlink11-20100506/. 
The latest edition of XLink 1.1 is available at http:/ /vvvvvv.vv3.org/ TR/xlink11/. 
İXML101 
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VVorld VVide VVeb Consortium, 8 December 2009. 
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Appendix L: Element index 


This appendix is informative, not normative. 
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The follovving are the elements in the SVG language: 


sla 
e “altGiyph” 
e “altGiyphDef” 


e “altGiyphltem” 
e “animate” 


e “animateColor” 





e “animateMotion” 


e “animateTransform” 


e “circle” 

e “clipPath” 

e “color-profile” 
e “cursor” 

e “defs” 

e “desc” 

e “ellipse” 

e “feBlend” 


e “feColorMatrix” 

e “feComponentTransfer” 
e “feComposite” 

e “feConvolveMatrix” 

e “feDiffuseLighting” 

e “feDisplacementMap” 

e “feDistantLight” 


e “feFlood” 

e “feFuncA” 

e “feFuncB” 

e “feFuncG” 

e “feFuncR” 

e “feGaussianBlur” 
e “felmage” 

e “feMerge” 


e “feMergeNode” 
e “feMorphology” 
ə “TeOffset” 


e “fePointLight” 
e “feSpecularLighting” 
e “feSpotLight” 
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e “feTile” 

e “feTurbulence” 
e “filter” 

e “font” 


e “font-face” 

e “font-face-format” 
e “font-face-name” 
e “font-face-src” 

e “fonft-face-uri” 


e “foreignObiect” 





ə 


" 8 

" "giyph” 

e “giyphRef” 
e “hkern” 

e “image” 

e “İine” 


e “linearGradient” 
e “marker” 

e “mask” 

e “metadata” 

e “missing-giyph” 


e “mpath” 

e “path” 

e “pattern” 
e “polygon” 
e “polyline” 
e “radialGradient” 
ə “Tect” 

e “script” 

. “set” 

e “stop” 

e “style” 

. “svg/ 

e “svvitch” 

e “symbol” 
e “text” 


e “textPath” 
e “title” 
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Appendix M: Attribute Index 
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M.1 Regular attributes 
M.2 Presentation attributes 


This appendix is informative, not normative. 


M.1 Regular attributes 





The follovving table lists all of the attributes defined in the SVG language, except for the presentation attributes, 
vvhich are treated in the Presentation attributes section belovv. For each attribute, the elements on vvhich the attrib- 
ute may be specifted is also given. 





c 
.o 
5 
İv) 
m") 
cc 
(3) 
c 
E 
ə) 
(ə) 
o 
cc 
. 
s 





Attribute Elements on vvhich the attribute may be specified 

“accent-height” “font-face” 

“accumulate” “animate”, “animateColor”, “animateMotion”, “animateTransform” 

“additive” “animate”, “animateColor”, “animateMotion”, “animateTransform” 

“alphabetic” “font-face” 

“amplitude” “feFuncA”, “feFuncB”, “feFuncG”, “feFuncR” V 
“arabic-form” “giyph” 

“ascent” “font-face” 

“attributeName” “animate”, “animateColor”, “animateTransform”, “set” 

“attributeType” “animate”, “animateColor”, “animateTransform”, “set” 

“azimuth” “feDistantLight” V 
“baseFrequency” “feTurbulence” y 
“baseProfile” “svg” 

“bbox” “font-face” 

“begin” “animate”, “animateColor”, “animateMotion”, “animateTransform”, “set” 

“bias” “feConvolveMatrix” V 
“by” “animate”, “animateColor”, “animateMotion”, “animateTransform” 

“calcMode” “animate”, “animateColor”, “animateMotion”, “animateTransform” 

“cap-height” “font-face” 

“class” “a”, “altGiyph”, “circle”, “clipPath”, “defs”, “desc”, “ellipse”, “feBlend”, “feColorMatrix”, “feComponentTransfer”, v 


“feComposite”, “feConvolveMatrix”, “feDiffuseLighting”, “feDisplacementMap”, “feFlood”, “feGaussianBlur”, “felmage”, 
“feMerge”, “feMorphology”, “feOffset”, “feSpecularLighting”, “feTile”, “feTurbulence”, “filter”, “font”, “foreignObiect”, “g”, 
“giyph”, “giyphRef”, “image”, “line”, “linearGradient”, “marker”, “mask”, “missing-giyph”, “path”, “pattern”, “polygon”, 


“polyline”, “radialGradient”, “rect”, “stop”, “svg”, “svvitch”, “symbol”, “text, “textPath”, “title”, “tref”, “tspan”, “use” 


“clipPathUnits” “clipPath” v 
“contentScriptType” “svg” 
“contentStyleType” “svg” 


cx” “circle” V 
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ex “ellipse” 

ex “radialGradient” 

“cy” “circle” 

“cy” “ellipse” 

“cy” “radialGradient” 

“de” “path” 

“d” “giyph”, “missing-giyph” 

“descent” “font-face” 

“diffuseConstant” “feDiffuseLighting” 

“divisor” “feConvolveMatrix” 

“dur” “animate”, “animateColor”, “animateMotion”, “animateTransform”, “set” 
“dx” “altGiyph” 

“dx” “feOffset” 

“dx” “giyphRef” 

“dx” “text” 

“dx” “tref), “ispan” 

“dy” “altGiyph” 

“dy” “feOffset” 

“dy” “giyphRef” 

“dy” “text” 

“dy” “tref), “ispan” 

“edgeMode” “feConvolveMatrix” 

“elevation” “feDistantLight” 

“end” “animate”, “animateColor”, “animateMotion”, “animateTransform”, “set” 
“exponent” “feFuncA”, “feFuncB”, “feFuncG”, “feFuncR” 


“externalResourcesRequired” “a”, “altGlyph”, “animate”, “animateColor”, “animateMotion”, “animateTransform”, “circle”, “clipPath”, “cursor”, “defs”, 


“ellipse”, “felmage”, “filter”, “fonr), “foreignObiect, “g”, “image”, “line”, “linearGradient”), “marker”, “mask”, “mpath”, 
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“ilP 


“filterRes” 


“filterUnits” 


“font-family” 


“font-size” 


“font-stretch” 


“font-style” 


“font-variant” 


“font-vveight” 


“format” 


“format” 


“from” 


“g2” 


“giyph-name” 


“giyphRef” 


“giyphRef” 


“gradientTransform” 


“gradientTransform” 


“gradientUnits” 


“gradientUnits” 


“hanging” 


“height” 


“path”, “pattern”, “polygon”, “polyline”, “radialGradient, “rect), “script, “set), “svg”, “svvitch”, “symbol”, “text”, “textPath”, 


“tref), “span”, “use”, “vievv” 


“animate”, “animateColor”, “animateMotion”, “animateTransform”, “set” 


“filter” 


“filter” 


“font-face” 


“font-face” 


“font-face” 


“font-face” 


“font-face” 


“font-face” 


“altGiyph” 


“giyphRef” 


“animate”, “animateColor”, “animateMotion”, “animateTransform” 


“radialGradient” 


“radialGradient” 


“hkern”, “vkern” 


“hkern”, “vkern” 


“glyph” 


“altGiyph” 


“giyphRef” 


“linearGradient” 


“radialGradient” 


“linearGradient” 


“radialGradient” 


“font-face” 


“filter” 
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“height” 


“height 


“height” 


“height” 


“height” 


“height 


“height” 


“height” 


“horiz-adv-x” 


“horiz-adv-x” 


“horiz-origin-x” 


“horiz-origin-y” 


dd” 


“ideographic” 


“in2” 


“in2” 


“in2” 


“intercept” 


“r 


“foreignObiect” 


“image” 


“pattern” 


“rect” 


“feBlend”, “feColorMatrix”, “feComponentTransfer”, “feComposite”, “feConvolveMatrix”, “feDiffuseLighting”, 
“feDisplacementMap”, “eFlood”, “feGaussianBlur”, “felmage”, “feMerge”, “feMorphology”, “feOffset”, 


“feSpecularLighting”, “TeTile”, “feTurbulence” 


“mask” 


“font” 


“giyph”, “missing-giyph” 


“font” 


“font” 


“a”, “altGiyph”, “altGiyphDef, “altGiyphitem”, “animate”, “animateColor”, “animateMotion”, “animateTransform”, 
“circle”, “clipPath”, “color-profile”, “cursor”, “defs”, “desc”, “ellipse”, “feBlend”, “feColorMatrix”, ““eComponentTransfer”, 
“feComposite”, “feConvolveMatrix”, “feDiffuseLighting”, “feDisplacementMap”, “feDistantLight”, “feFlood”, “feFuncA”, 
“feFuncB”, “feFuncG”, “feFuncR”, “feGaussianBlur”, “felmage”, “feMerge”, “feMergeNode”, “feMorphology”, “eOffser, 
“fePointLight”, “feSpecularLighting”, “feSpotLight, “feTile”, “feTurbulence”, “filter”, “font”), “font-face”, 
“font-face-format, “font-face-name”, “font-face-src”, “font-face-uri”, “foreignObiect”, “g”, “glyph”, “gliyphRef, “hkern”, 
“image”, “line”, “linearGradient”, “marker”, “mask”, “metadata”, “missing-giyph”, “mpath”, “path”, “pattern”, “polygon”, 
“polyline”, “radialGradient”, “rect), “script”, “set”, “stop”, “style”, “svg”, “svvitch”, “symbor, “text”, “textPath”, “title”, “tref”, 


“tspan”, “use”, “vievv”, “vkern” 


“font-face” 


“feBlend”, “feColorMatrix”, “eComponentTransfer”, “eComposite”, “feConvolveMatrix”, “feDiffuseLighting”, 


“feDisplacementMap”, “feGaussianBlur”, “feMorphology”, “eOffset”, “feSpecularLighting”, “eTile” 


“feBlend” 


“feComposite” 


“feDisplacementMap” 


“feFuncA”, “feFuncB”, “feFuncG”, “feFuncR” 


“hkern”, “vkern” 
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“kr 


“kz” 


“k3” 


“ka” 


“kernelMatrix” 


“kernelUnitLength” 


“kernelUnitLength” 


“kernelUnitLength” 


“feComposite” 


“feComposite” 


“feComposite” 


“feComposite” 


“feConvolveMatrix” 


“feConvolveMatrix” 


“feDiffuseLighting” 


“feSpecularLighting” 





“keyPoints” “animateMotion” 

“keySplines” “animate”, “animateColor”, “animateMotion”, “animateTransform” 
“keyTimes” “animate”, “animateColor”, “animateMotion”, “animateTransform” 
“ang” “giyph” 

“lengthAdiust” “text), “textPath”, “tref”, “ispan” 

“limitingConeAngle” “feSpotLight” 

“local” “color-profile” 

“markerHeight” “marker” 

“markerUnits” “marker” 

“markerVVidth” “marker” 

“maskContentünits” “mask” 

“masküUnits” “mask” 

“mathematical” “font-face” 

“max” “animate”, “animateColor”, “animateMotion”, “animateTransform”, “set” 
“media” “style” 

“method” “textPath” 

“min” “animate”, “animateColor”, “animateMotion”, “animateTransform”, “set” 
“mode” “feBlend” 


“name” “color-profile” 
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“name” “font-face-name” 

“numOctaves” “feTurbulence” 

“offset” “stop” 

“offset” “feFuncA”, “feFuncB”, “feFuncG”, “feFuncR” 

“onabort” “svg” 

“onactivate” “a”, “altGiyph”, “circle”, “defs”, “ellipse”, “foreignObiect”, “g”, “image”, “line”, “path”, “polygon”, “polyline”, “rect”, “svg”, 


“svvitch”, “symbol”, “text, “textPath”, “tref”, “tspan”, “use” 


“onbegin” “animate”, “animateColor”, “animateMotion”, “animateTransform”, “set” 





“onclick” “a”, “altGiyph”, “circle”, “defs”, “ellipse”, “foreignObiect”, “g”, “image”, “line”, “path”, “polygon”, “polyline”, “rect”, “svg”, 


“svvitch”, “symbol”, “text”, “textPath”, “tref”, “tspan”, “use” 


“onend” “animate”, “animateColor”, “animateMotion”, “animateTransform”, “set” 
“onerror” “svg” 
“onfocusin” “a”, “altGlyph”, “circle”, “defs”, “ellipse”, “foreignObiect”, “g”, “image”, “line”, “path”, “polygon”, “polyline”, “rect”, “svg”, 


“svvitch”, “symbol”, “text, “textPath”, “tref”, “tspan”, “use” 


“onfocusout” “a”, “altGiyph”, “circle”, “defs”, “ellipse”, “foreignObiect”, “g”, “image”, “line”, “path”, “polygon”, “polyline”, “rect”, “svg”, 


“svvitch”, “symbol”, “text, “textPath”, “tref”, “tspan”, “use” 


“onload” “a”, “altGiyph”, “circle”, “defs”, “ellipse”, “foreignObiect”, “g”, “image”, “line”, “path”, “polygon”, “polyline”, “rect”, “svg”, 


“svvitch”, “symbol”, “text, “textPath”, “tref”, “tspan”, “use” 


“onload” “animate”, “animateColor”, “animateMotion”, “animateTransform”, “set” 


“onmousedovn” “a”, “altGiyph”, “circle”, “defs”, “ellipse”, “foreignObiect”, “g”, “image”, “line”, “path”, “polygon”, “polyline”, “rect”, “svg”, 


“svvitch”, “symbol”, “text”, “textPath”, “tref”, “tspan”, “use” 


“onmousemove” “a”, “altGiyph”, “circle”, “defs”, “ellipse”, “foreignObiect”, “g”, “image”, “line”, “path”, “polygon”, “polyline”, “rect”, “svg”, 


“svvitch”, “symbol”, “text”, “textPath”, “tref”, “tspan”, “use” 


“onmouseout” “a”, “altGiyph”, “circle”, “defs”, “ellipse”, “foreignObiect”, “g”, “image”, “line”, “path”, “polygon”, “polyline”, “rect”, “svg”, 


“svvitch”, “symbol”, “text”, “textPath”, “tref”, “tspan”, “use” 


“onmouseover” “a”, “altGlyph”, “circle”, “defs”, “ellipse”, “foreignObiect”, “g”, “image”, “line”, “path”, “polygon”, “polyline”, “rect”, “svg”, 


“svvitch”, “symbol”, “text, “textPath”, “tref”, “tspan”, “use” 


“onmouseup” “a”, “altGlyph”, “circle”, “defs”, “ellipse”, “foreignObiect”, “g”, “image”, “line”, “path”, “polygon”, “polyline”, “rect”, “svg”, 


“svvitch”, “symbol”, “text, “textPath”, “tref”, “tspan”, “use” 


“onrepeat” “animate”, “animateColor”, “animateMotion”, “animateTransform”, “set” 
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“onresize” 


“onscroll” 


“onunload” 


“onzoom” 


“operator” 


“operator” 


“order” 


“orient” 


“orientation” 


“origin” 


“overline-position” 


“overline-thickness” 


“panose-1” 


“path” 


“pathLength” 


“patternContentUnits” 


“patternTransform” 


“patternUnits” 


“points” 


“points” 


“pointsAtX” 


“pointsAtY” 


“pointsAtZ” 


“preserveAlpha” 


“preserveAspectRatio” 


“primitiveUnits” 


“” 


“feComposite” 


“feMorphology” 


“feConvolveMatrix” 


“marker” 


“giyph” 


“animateMotion” 


“font-face” 


“font-face” 


“font-face” 


“animateMotion” 


“path” 


“pattern” 


“pattern” 


“pattern” 


“polygon 


“polyline” 


“feSpotLight” 


“feSpotLight” 


“feSpotLight” 


“feConvolveMatrix” 


“felmage”, “image”, “marker”, “pattern”, “svg”, “symbol”, “viev” 


“filter” 


“circle” 
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in “radialGradient” 

“radius” “feMorphology” 

“refX” “marker” 

“refY” “marker” 

“rendering-intent” “color-profile” 

“repeatCount” “animate”, “animateColor”, “animateMotion”, “animateTransform”, “set” 

“repeatDur” “animate”, “animateColor”, “animateMotion”, “animateTransform”, “set” 

“requiredExtensions” “a”, “altGiyph”, “animate”, “animateColor”, “animateMotion”, “animateTransform”, “circle”, “clipPath”, “cursor”, “defs”, 


“ellipse”, “foreignObiect”, “g”, “image”, “line”, “mask”, “path”, “pattern”, “polygon”, “polyline”, “rect”, “set”, “svg”, “svvitch”, 





“text, “textPath”, “tref”, “span”, “use” 
“requiredFeatures” “a”, “altGiyph”, “animate”, “animateColor”, “animateMotion”, “animateTransform”, “circle”, “clipPath”, “cursor”, “defs”, 
“ellipse”, “foreignObiect”, “g”, “image”, “line”, “mask”, “path”, “pattern”, “polygon”, “polyline”, “rect”, “set”, “svg”, “svvitch”, 


“Text”, “textPath”, “tref”, “tspan”, “use” 


“restart” “animate”, “animateColor”, “animateMotion”, “animateTransform”, “set” 


“result” “feBlend”, “feColorMatrix”, “feComponentTransfer”, “feComposite”, “feConvolveMatrix”, “feDiffuseLighting”, 
“feDisplacementMap”, “feFlood”, “feGaussianBlur”, “felmage”, “feMerge”, “feMorphology”, “feOffset”, 


“feSpecularLighting”, “feTile”, “feTurbulence” 


“rotate” “altGiyph” 
“rotate” “animateMotion” 
“rotate” “Text” 

“rotate” “tref), “ispan” 
rx “ellipse” 

“x “rect” 

“ry” “ellipse” 

“ry” “rect” 

“scale” “feDisplacementMap” 
“seed” “feTurbulence” 
“slope” “font-face” 


“slope” “feFuncA”, “feFuncB”, “feFuncG”, “feFuncR” 
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“spacing” 


“specularConstant” 


“specularExponent” 


“specularExponent” 


“spreadMethod” 


“spreadMethod” 


“startOffset” 


“stdDeviation” 


“stemh” 


“stemv” 


“stitchTiles” 


“strikethrough-position” 


“strikethrough-thickness” 


“string” 


“style” 


“surfaceScale” 


“surfaceScale” 


“systemLanguage” 


“tableValues” 


“target” 


“targetX” 


“targetY” 


“textLength” 


“textPath” 


“feSpecularLighting” 


“feSpecularLighting” 


“feSpotLight” 


“linearGradient” 


“radialGradient” 


“textPath” 


“feGaussianBlur” 


“font-face” 


“font-face” 


“feTurbulence” 


“font-face” 


“font-face” 


“font-face-format” 


“a”, “altGiyph”, “circle”, “clipPath”, “defs”, “desc”, “ellipse”, “feBlend”, “feColorMatrix”, “feComponentTransfer”, 
“feComposite”, “feConvolveMatrix”, “feDiffuseLighting”, “feDisplacementMap”, “feFlood”, “feGaussianBlur”, “felmage”, 
“feMerge”, “feMorphology”, “feOffset”, “feSpecularLighting”, “feTile”, “feTurbulence”, “filter”, “font”, “foreignObiect”, “g”, 
“glyph”, “giyphRef”, “image”, “line”, “linearGradient, “marker”, “mask”, “missing-giyph”, “path”, “pattern”, “polygon”, 


“polyline”, “radialGradient”, “rect”, “stop”, “svg”, “svvitch”, “symbol”, “text, “textPath”, “title”, “tref”, “tspan”, “use” 


“feDiffuseLighting” 


“feSpecularLighting” 


“a”, “altGiyph”, “animate”, “animateColor”, “animateMotion”, “animateTransform”, “circle”, “clipPath”, “cursor”, “defs”, 
“ellipse”, “foreignObiect”, “g”, “image”, “line”, “mask”, “path”, “pattern”, “polygon”, “polyline”, “rect”, “set”, “svg”, “svvitch”, 


“text”, “textPath”, “tref”, “span”, “use” 


“feFuncA”, “feFuncB”, “feFuncG”, “feFuncR” 


“a” 


“feConvolveMatrix” 


“feConvolveMatrix” 


“text” 
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“textLength” “textPath”, “tref”, “tspan” V 
“title” “style” 

“to” “set” 

“to” “animate”, “animateColor”, “animateMotion”, “animateTransform” 

“transform” “a”, “circle”, “clipPath”, “defs”, “ellipse”, “foreignObiect, “g”, “image”, “line”, “path”, “polygon”, “polyline”, “rect”, “svvitch”, V 


“text”, “use” 





“iype” “animateTransform” 

“type” “feColorMatrix” V 
“iype” “feTurbulence” V 
“type” “script” 

“iype” “style” 

“type” “feFuncA”, “feFuncB”, “feFuncG”, “feFuncR” V 
“uT “hkern”, “vkern” 

“u2” “hkern”, “vkern” 

“underline-position” “font-face” 

“underline-thickness” “font-face” 

“unicode” “giyph” 

“unicode-range” “font-face” 

“units-per-em” “font-face” 

“v-alphabetic” “font-face” 

“v-hanging” “font-face” 

“v-ideographic” “font-face” 

“v-mathematical” “font-face” 

“values” “feColorMatrix” y 
“values” “animate”, “animateColor”, “animateMotion”, “animateTransform” 

“version” “svg” 


“vert-adv-y” “font” 
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“vert-adv-y” 


“vert-origin-x” 


“vert-origin-x” 


“vert-origin-y” 


“vert-origin-y” 


“giyph”, “missing-giyph” 


“font” 


“glyph”, “missing-giyph” 


“font” 


“giyph”, “missing-giyph” 





“viev/Box” “marker”, “pattern”, “svg”, “symbol”, “vievv” 

“vievvTarget” “vievv” 

“vidth” “filter” 

“vidth” “foreignObiect” 

“vidth” “image” 

“vidth” “pattern” 

“vidth” “rect” 

“vidth” “svg” 

“vidth” “use” 

“vidth” “feBlend”, “feColorMatrix”, “eComponentTransfer”, “feComposite”, “feConvolveMatrix”, “feDiffuseLighting”, 


“feDisplacementMap”, “feFlood”, “feGaussianBlur”, “felmage”, “feMerge”, “feMorphology”, “feOffset”, 


“feSpecularLighting”, “TeTile”, “feTurbulence” 


“vidth” “mask” 
“vidths” “font-face” 

ix “altGiyph” 

“x” “cursor” 

"x. “fePointLight” 
5 “feSpotLight” 
x. “filter” 

ix) “foreignObyect” 
5 “giyphRef” 


x “image” 
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sə “pattern” 

“x “rect” 

axı “svg” 

“x “text” 

x “use” 

x. “feBlend”, “feColorMatrix”, “eComponentTransfer”, “feComposite”, “feConvolveMatrix”, “feDiffuseLighting”, 
“feDisplacementMap”, “feFlood”, “feGaussianBlur”, “felmage”, “feMerge”, “feMorphology”, “feOffset”, 
“feSpecularLighting”, “feTile”, “feTurbulence” 

x “mask” 

x. “tref), span” 

“x-height” “font-face” 

“x1” “line” 

ex “linearGradient” 

5x2: “line” 

5x2: “linearGradient” 

“xChannelSelector” “feDisplacementMap” 

“xlink:actuate” “a” 

“xlink:actuate” “altGiyph”, “animate”, “animateColor”, “animateMotion”, “animateTransform”, “color-profile”, “cursor”, “felmage”, 
“filter”, “font-face-uri”, “glyphRef”, “image”, “mpath”, “pattern”, “script”, “set”, “use” 

“xlink-arcrole” “a”, “altGiyph”, “animate”, “animateColor”, “animateMotion”, “animateTransform”, “color-profile”, “cursor”, “felmage”, 
“filter”, “font-face-uri”, “giyphRef,, “image”, “linearGradient, “mpath”, “pattern”, “radialGradient”, “script”, “set”, 
“textPath”, “tref”, “use” 

"xlink:href” “a” 

“xlink:href” “altGlyph” 

"xlink:href” “color-profile” 

“xlink:href” “cursor” 

“xlink:href” “felmage” 


"xlink:href” “filter” 
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“xlink:href” “font-face-uri” 

“xlink:href” “giyphRef” 

“xlink:href” “image” 

“xlink:href” “linearGradient” 

“xlink:href” “mpath” 

“xlink:href” "pattern” 

"xlink:href” “radialGradient” 

“xlink:href” “script” 

“xlink:href” “textPath” 

“xlink:href” “use” 

“xlink:href” “animate”, “animateColor”, “animateMotion”, “animateTransform”, “set” 
“xlink:href” “tref” 

“xlink:role” “a”, “altGiyph”, “animate”, “animateColor”, “animateMotion”, “animateTransform”, “color-profile”, “cursor”, “felmage”, 


“filter”, “font-face-uri”, “giyphRef”, “image”, “linearGradient, “mpath”, “pattern”, “radialGradient”, “script”, “set”, 


“textPath”, “ref”, “use” 


“xlink:shov” 


“xlink:shovv” “altGiyph”, “animate”, “animateColor”, “animateMotion”, “animateTransform”, “color-profile”, “cursor”, “felmage”, 


“filter”, “font-face-uri”, “giyphRef”, “image”, “mpath”, “pattern”, “script”, “set”, “use” 


“xlink:title” “a”, “altGiyph”, “animate”, “animateColor”, “animateMotion”, “animateTransform”, “color-profile”, “cursor”, “felmage”, 
“filter”, “font-face-uri”, “giyphRef”, “image”, “linearGradient, “mpath”, “pattern”, “radialGradient”, “script”, “set, 


“textPath”, “tref”, “use” 


“xlink:type” “a”, “altGiyph”, “animate”, “animateColor”, “animateMotion”, “animateTransform”, “color-profile”, “cursor”, “felmage”, 
“filter”, “font-face-uri”, “giyphRef”, “image”, “linearGradient, “mpath”, “pattern”, “radialGradient”, “script”, “set”, 


“textPath”, “tref”, “use” 


“xml:base” “a”, “altGiyph”, “altGiyphDef, “altGiyphitem”, “animate”, “animateColor”, “animateMotion”, “animateTransform”, 
“circle”, “clipPath”, “color-profile”, “cursor”, “defs”, “desc”, “ellipse”, “feBlend”, “feColorMatrix”, “eComponentTransfer”, 
“feComposite”, “feConvolveMatrix”, “feDiffuseLighting”, “feDisplacementMap”, “TeDistantLight, “feFlood”, “feFuncA”, 
“feFuncB”, “feFuncG”, “feFuncR”, “feGaussianBlur”, “felmage”, “feMerge”, “feMergeNode”, “feMorphology”, “feOffset,, 
“fePointLight, “feSpecularLighting”, “feSpotLighr, “eTile”, “eTurbulence”, “filter”, “font), “font-face”, 
“font-face-format”, “font-face-name”, “font-face-src”, “font-face-uri”, “foreignObiect”, “g”, “glyph”, “giyphRef, “hkern”, 


“image”, “line”, “linearGradient”, “marker”, “mask”, “metadata”, “missing-giyph”, “mpath”, “path”, “pattern”, “polygon”, 


“polyline”, “radialGradient, “rect”, “script, “set”, “stop”, “style”, “svg”, “svvitch”, “symbol”, “text”, “textPath”, “title”, “ref”, 


“tspan”, “use”, “vievv”, “vkern” 


“xml:lang” “a”, “altGlyph”, “altGiyphDef, “altGiyphitem”, “animate”, “animateColor”, “animateMotion”, “animateTransform”, 


“circle”, “clipPath”, “color-profile”, “cursor”, “defs”, “desc”, “ellipse”, “feBlend”, “feColorMatrix”, ““eComponentTransfer”, 
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“feComposite”, “feConvolveMatrix”, “feDiffuseLighting”, “feDisplacementMap”, “feDistantLight”, “feFlood”, “feFuncA”, 
“feFuncB”, “feFuncG”, “feFuncR”, “feGaussianBlur”, “felmage”, “feMerge”, “feMergeNode”, “feMorphology”, “feOffset, 
“fePointLight”, “feSpecularLighting”, “feSpotLight”, “feTile”, “feTurbulence”, “filter”, “font”, “font-face”, 
“font-face-format”, “font-face-name”, “font-face-src”, “font-face-uri”, “foreignObiect”, “g”, “glyph”, “giyphRef, “hkern”, 
“image,, “line”, “linearGradient”, “marker”, “mask”, “metadata”, “missing-giyph”, “mpath”, “path”, “pattern”, “polygon”, 
“polyline”, “radialGradient”, “rect”, “script”, “set”, “stop”, “style”, “svg”, “svvitch”, “symboP”, “text”, “textPath”, “title”, “tref , 


“tspan”, “use”, “vievv”, “vkern” 





“xml:space” “a”, “altGiyph”, “altGiyphDef, “altGiyphitem”, “animate”, “animateColor”, “animateMotion”, “animateTransform”, 
“circle”, “clipPath”, “color-profile”, “cursor”, “defs”, “desc”, “ellipse”, “feBlend”, “feColorMatrix”, “feComponentTransfer”, 
“feComposite”, “feConvolveMatrix”, “feDiffuseLighting”, “eDisplacementMap”, “feDistantLight, “feFlood”, “feFuncA”, 
“feFuncB”, “feFuncG”, “feFuncR”, “feGaussianBlur”, “felmage”, “feMerge”, “feMergeNode”, “feMorphology”, “feOffset,, 
“fePointLight, “feSpecularLighting”, “feSpotLighr, “eTile”, “feTurbulence”, “filter”, “font), “font-face”, 
“font-face-format”, “font-face-name”, “font-face-src”, “font-face-uri”, “foreignObiect”, “g”, “glyph”, “giyphRef, “hkern”, 
“image,, “line”, “linearGradient), “marker”, “mask”, “metadata”, “missing-giyph”, “mpath”, “path”, “pattern”, “polygon”, 
“polyline”, “radialGradient”, “rect”, “script”, “set”, “stop”, “style”, “svg”, “svvitch”, “symboP”, “text”, “textPath”, “title”, “tref, 


“tspan”, “use”, “vievv”, “vkern” 


evə “altGlyph” 

öz “cursor” 

“v. “fePointLight” 
iə “feSpotLight” 
öz “filter” 

22 “foreignObiect” 
“Y: “giyphRef” 

ey: “image” 

öz “pattern” 

29 “rect” 

” “svg” 

ön “text” 
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y” “feBlend”, “feColorMatrix”, “feComponentTransfer”, “feComposite”, “feConvolveMatrix”, “feDiffuseLighting”, V 
“feDisplacementMap”, “feFlood”, “feGaussianBlur”, “felmage”, “feMerge”, “feMorphology”, “feOffset”, 


“feSpecularLighting”, “TeTile”, “feTurbulence” 


” “mask” d 
“” “tref”), ispan” qi 
“1” “line” v 
YT” “linearGradient” 4 
yz” "Tine” . 
“y2” “linearGradient” v 
“yChannelSelector” “feDisplacementMap” v 
“. “fePointLight” V 
zəl “feSpotLight” v 
“zoomAndPan” “svg”, “vievv” 





M.2 Presentation attributes 


As deseribed in the Styling chapter, for each property there exists a corresponding presentation attribute. The table 
belovv lists the presentation attributes and the elements on vvhich they may be specifted. 





Presentation attributes Elements on vvhich the attributes may be specified 
“alignment-baseline”, “baseline-shift,, “clip-path”, “clip-rule”, “clip”, “color-interpolation-filters”, “a”, “altGiyph”, “animate”, “animateColor”, “circle”, “clipPath”, 
“color-interpolation”, “color-profile”, “color-rendering”, “color”, “cursor”, “direction”, “display”, “defs”, “ellipse”, “feBlend”, “feColorMatrix”, 
“dominant-baseline”, “enable-background”, “fill-opacity”, “Till-rule”, fil”, “filter”, “flood-color”, “feComponentTransfer”, “feComposite”, “feConvolveMatrix”, 
“flood-opacity”, “font-family”, “font-size-adiust”, “font-size”, “font-stretch”, “font-style”, “feDiffuseLighting”, “feDisplacementMap”, “feFlood”, 
“font-variant”, “font-vveight”, “glyph-orientation-horizontal”, “glyph-orientation-vertical”, “feGaussianBlur”, “felmage”, “feMerge”, “feMorphology”, 
“iİmage-rendering”, “kerning”, “letter-spacing”, “lighting-color”, “marker-end”, “marker-mid”, “TeOffset”, “feSpecularLighting”, “TeTile”, “eTurbulence”, 
“marker-start”?, “mask”, “opacity”, “overflov”, “pointer-events”, “shape-rendering”, “stop-color”, “filter”, “font”, “foreignObiect, “g”, “glyph”, “giyphRerf, 
“stop-opacity”, “stroke-dasharray”, “stroke-dashoffset, “stroke-linecap”, “stroke-line/oin”, “image”, “line”, “linearGradient”, “marker”, “mask”, 
“stroke-miterlimit”, “stroke-opacity”, “stroke-vvidth”, “stroke”, “text-anchor”, “text-decoration”, “missing-giyph”, “path”, “pattern”, “polygon”, “polyline”, 
“text-rendering”, “unicode-bidi”, “visibility”, “vord-spacing” and “vriting-mode” “radialGradient, “rect”, “stop”, “svg”, “svvitch”, “symbol, 


“text”, “textPath”, “tref, “tspan” and “use” 
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Appendix N: Property index 


This appendix is informative, not normative. 








VELİTİ İnitial value ələlİ- 0) Percentages Media 
“alignment-baseline” auto 1 baseline 1 see property “tspan”, “tref, no N/A visual yes 
before-edge 1 description “altGiyph”, 
text-before-edge 1 middle 1 “textPath” elements 
central / after-edge 1 
text-after-edge 1 
ideographic 1 alphabetic 1 
hanging 1 mathematical 1 
inherit 
“baseline-shift” baseline I sub super 1 baseline “tspan”, “tref , no refer to the visual yes 
cpercentages 1 -lengthə 1 “altGiyph”, "line height" 
inherit “textPath” elements of the “text” 
element, 
vvhich in the 
case of SVG 
is defined to 
be equal to 
the font size 
“clip” xshapes İl auto 1 inherit auto elements vvhich no N/A visual yes 
establish a nevv 
vievvport, “pattern” 
elements and 
“marker” elements 
“clip-path” xfunciris 1 none 1 inherit none container elements no N/A visual yes 
and graphics 
elements 
“clip-rule” nonzero İl evenodd 1 inherit nonzero graphics elements yes N/A visual yes 
vvithin a “clipPath” 
element 
“color” color” 1 inherit depends on elements to vvhich yes N/A visual yes 
user agent properties “fil, 


“stroke”, 


“stop-color”, 
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“color-interpolation” 


“color-interpolation-filters” 





“color-profile” 


“color-rendering” 


“cursor” 


“direction” 


“display” 


auto İ SRGB İ linearRGB 1 


inherit 


auto İ SRGB İ linearRGB 1 


inherit 


İnitial value 


sRGB 


linearRGB 


Applies to 


“flood-color”, 
“lighting-color” 
appiy 

container 
elements, graphics 


elements and 


“animateColor” 


filter primitives 


yes 


yes 


Percentages 


N/A 


N/A 


visual 


visual 





yes 


yes 





auto / SRGB 1 -names İ 


cfunciri”- 1 inherit 


auto / optimizeSpeed 1 


optimizeQuality 1 inherit 


Hie-funciris ,FF Vauto 1 
crosshair 1 default I pointer 
move l e-resize 1 ne-resize 1 
nvv-resize 1 n-resize 1 
se-resize 1 svv-resize 1 
s-resize 1 vv-resizel text / 


vvait 1 help 111 inherit 


İtr 1 rtl 1 inherit 


inline 1 block 1 list-item 1 
run-in 1 compact 1 marker l 
table l inline-table 1 
table-rovv-group 1 
table-header-group 1 
table-footer-group 1 
table-rovv İ 
table-column-group 1 
table-column 1 table-cell / 
table-caption İ none 1 


inherit 


auto 


auto 


auto 


lir 


inline 


“image” elements 
that refer to raster 


images 


container 
elements, graphics 
elements and 


“animateColor” 


container elements 
and graphics 


elements 


text content 


elements 


“svg”, “g”, “svvitch”, 
“a”, “foreignObiect, 
graphics elements 
(indluding the “text” 
element) and text 
sub-elements (i.e., 
“tspan”, “tref), 
“altGiyph”, 


“textPath”) 


yes 


yes 


yes 


yes 


no 


N/A 


N/A 


N/A 


N/A 


N/A 


visual 


visual 


visual, 


interactive 


visual 


all 


yes 


yes 


yes 


no 


yes 


c 
.Ə 
5 
İv) 
m") 
(s 
(3) 
E 
E 
ə) 
(ə) 
o 
ad 
Ə 
s 





“dominant-baseline” 


“enable-background” 


“ilP 


“fill-opacity” 


“fill-rule” 


“filter” 


“flood-color” 


“flood-opacity” 


“font” 


“font-family” 


İnitial value 


auto İ use-script İ auto 
no-change 1 reset-size 1 
ideographic 1 alphabetic 1 

hanging 1 mathematical 1 

central / middle 1 

text-after-edge 1 


text-before-edge 1 inherit 


accumulate 1 nevv İ cx” cy accumulate 


evvidthə -height” 11 inherit 


cpainto (See Specifying black 
paint) 
copacity-value”- 1 inherit 1 


nonzero İl evenodd 1 inherit nonzero 


xfunciris 1 none 1 inherit none 


currentColor 1 black 
ccolor?- İcicccolor”1 1 


inherit 








copacity-values- 1 inherit 1 


Tİ1“font-siyle” İl “font-variant? see individual 
İl “font-vveight” 1? “font-size” properties 

İ/ Tine-height" 1? 

“font-family” 1İ caption İ 

icon / menu l message-box 


İ small-caption İl status-bar 1 


inherit 
İl -family-names 1 depends on 
xgeneric-family” 11 user agent 


xfamily-names- ) 


xgeneric-family”1 1 inherit 


Applies to 


text content no 


elements 


container elements no 


shapes and text yes 


content elements 


shapes and text yes 


content elements 


shapes and text yes 


content elements 


container elements no 
and graphics 


elements 


“feFlood” elements no 


“feFlood” elements no 


text content yes 
elements 
text content yes 
elements 


Percentages 


XEHİİ 











N/A visual yes 
N/A visual no 
N/A visual yes 
N/A visual yes 
N/A visual yes 
N/A visual yes 
N/A visual yes 
N/A visual yes 
see visual yes u 
individual 

properties 

N/A visual yes 
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“font-size” 


“font-size-adiust” 


“font-stretch” 


“font-style” 


“font-variant” 


“font-vveight” 


“giyph-orientation-horizontal” 


“giyph-orientation-vertical” 


“image-rendering” 


“kerning” 


“letter-spacing” 


“lighting-color” 


xabsolute-sizes- / 
xrelative-sizes- / -lengths- 1 


xpercentages 1 inherit 


xnumber: 1 none 1 inherit 


normal 1 vvider 1 narrovver İ 
ultra-condensed 1 
extra-condensed 1 
condensed 1 
semi-condensed 1 
semi-expanded 1 expanded 
İ extra-expanded 1 


ultra-expanded 1 inherit 


normal l italic / oblique 1 


inherit 


normal 1 small-caps 1 inherit 


normal 1 bold 1 bolder 1 
lighter 1 100 1 200 1 3001 
400 1 500 1 600 1 700 1 8001 
900 1 inherit 


xangles 1 inherit 


auto / cangle” 1 inherit 


auto / optimizeSpeed 1 


optimizeQuality 1 inherit 


auto 1 -length” 1 inherit 


normal 1 -length” 1 inherit 


currentColor İ 


Initial value 


medium 


none 


normal 


normal 


normal 


normal 


Odeg 


auto 


auto 


auto 


normal 


vvhite 


Applies to 


text content 


elements 


text content 


elements 


text content 


elements 


text content 


elements 


text content 


elements 


text content 


elements 


text content 


elements 


text content 


elements 


images 


text content 


elements 


text content 


elements 


“feDiffuseLighting” 


and 


yes, the 
computed 
value is 
inherited 


yes 


yes 


yes 


yes 


yes 


yes 


yes 


yes 


yes 


yes 





Percentages 

refer to visual yes 
parent 

elements 

font size 

N/A visual yes m 
N/A visual yes 
N/A visual yes 
N/A visual yes 
N/A visual yes 
N/A visual no 
N/A visual no 
N/A visual yes 
N/A visual yes 
N/A visual yes 
N/A visual yes 
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“marker” 


“marker-end” 
“marker-mid” 


“marker-start” 


“mask” 


“opacity” 


“overflov” 


“pointer-events” 


“shape-rendering” 


“stop-color” 


“stop-opacity” 


“stroke” 


“stroke-dasharray” 


ccolorə İcicccolor”1 1 


inherit 


see individual properties 


none l 
inherit 1 


xfunciris. 


xfunciri” İ none 1 inherit 


copacity-value”- 1 inherit 


visible 1 hidden 1 scroll 1 


auto 1 inherit 


visiblePainted 1 visiblerFill 1 
visibleStroke 1 visible 1 
painted 1 fill 1 stroke 1 all 1 


none 1 inherit 


auto / optimizeSpeed 1 
crispEdges 1 


geometricPrecision 1 inherit 


currentColor İ 
ccolorə İcicccolors11 


inherit 


xopacity-value”- 1 inherit 


xpainto (See Specifying 


paint) 


none 1 cdasharrayzs İl inherit 


Initial value 


see individual 


properties 


none 


none 


see prose 


visiblePainted 


auto 


black 


none 


none 


Applies to 


“TfeSpecularLighting” 


elements 


“path”, “line”, 
“polyline” and 


“polygon” elements 


“path”, “line”, 
“polyline” and 


“polygon” elements 


container elements 
and graphics 


elements 


container elements 
and graphics 


elements 


elements vvhich 
establish a nevv 
vievvport, “pattern” 
elements and 


“marker” elements 


graphics elements 


shapes 


“stop” elements 


“stop” elements 


shapes and text 


content elements 


shapes and text 


content elements 


yes 


yes 


no 


no 


no 


yes 


yes 


no 


no 


yes 


yes 


Percentages 


N/A 


N/A 


N/A 


N/A 


N/A 


N/A 


N/A 


N/A 


N/A 


N/A 


N/A 


visual 


visual 


visual 


visual 


visual 


visual 


visual 


visual 


visual 


visual 


visual 





yes 


yes 


yes 


yes 


yes 


yes 


yes 


yes 


yes 


yes 


yes İT) 
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“stroke-dashoffset” 


“stroke-linecap” 


“stroke-line)oin” 


“stroke-miterlimit” 


“stroke-opacity” 


“stroke-vvidth” 


“text-anchor” 


“text-decoration” 


“text-rendering” 


“unicode-bidi” 





“vord-spacing” 


“vriting-mode” 


cpercentages 1 -length”- 1 


inherit 


butt / round 1 square 1 


inherit 


miter İ round 1 bevel l 


inherit 


xmiterlimitə- 1 inherit 


xopacity-value”- 1 inherit 


xpercentages 1 -lengthə 1 


inherit 


start I middle 1 end 1 inherit 


none 1 Tunderline Il 
overline İl line-through Il 
blink 11 inherit 


auto / optimizeSpeed 1 
optimizeLegibility 1 


geometricPrecision 1 inherit 


normal / embed 1 


bidi-override 1 inherit 


visible 1 hidden 1 collapse 1 


inherit 


normal 1 -length” 1 inherit 


İr-tb 1 ri-tb 1 tb-rl lirlrlltbl 


inherit 


Initial value 


butt 


miter 


start 


none 


auto 


normal 


visible 


normal 


İr-tb 


Applies to 


shapes and text 


content elements 


shapes and text 


content elements 


shapes and text 


content elements 


shapes and text 


content elements 


shapes and text 


content elements 


shapes and text 


content elements 


text content 


elements 


text content 


elements 


“text” elements 


text content 


elements 


graphics elements 
(indluding the “text” 
element) and text 
sub-elements (i.e., 
“tspan”, “tref), 
“altGiyph”, 


“textPath” and “a”) 


text content 


elements 


“text” elements 


yes 


yes 


yes 


yes 


yes 


yes 


yes 


no (see 


prose) 


yes 


no 


yes 


yes 


yes 


Percentages 


see prose 


N/A 


N/A 


N/A 


N/A 


N/A 


N/A 


N/A 


N/A 


N/A 


N/A 


N/A 


N/A 


visual 


visual 


visual 


visual 


visual 


visual 


visual 


visual 


visual 


visual 


visual 


visual 


visual 





yes 


yes 


yes 


yes 


yes 


yes 


yes 


yes 


yes 


no 


yes 


yes 


no 





Hİ Tpe “font”, “font-size-adiust” and “stroke-dasharray” properties are animatable but do not support additive 


animation. 
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Appendix O: Feature Strings 


Contents 


O.1 Introduction 
O.2 SVG 1.1 feature strings 
O.3 SVG 1.0 feature strings 


This appendix is normative. 


O.1 İntroduction 


"The follovving are the feature strings for the “requiredFeatures” attribute. These same feature strings apply to the 
hasFeature method call that is part of the SVG DOM“s support for the DOMlmplementation interface defined in 
DOM Level 2 Core İDOM2) (see Feature strings for the hasFeature method call). In some cases the feature strings 
map directly to a set of attributes, properties or elements, in others they represent some functionality of the user 
agent (that it is a dynamic vievver for example). Note that the format and naming for feature strings changed from 
SVG 1.0 İSVG10) to SVG 1.1. The SVG 140 feature strings are listed belovv after the SVG 1.1 feature strings and User 
Agents should support all listed feature strings for compatibility reasons. Hovvever, the SVG 1.0 feature strings can 
be considered deprecated. 


O.2 SVG 1.1 feature strings 


Feature String: 
http://vvvvvv.vv3.org/ TR/SVG11/featuresSVG 

User Agent Supporis: 
At least one of the follovving (all of vvhich are deseribed subsequently): "http://vvvvvv.vv3.org/ TR/SVG11/ 
feature/SVG-static", "http://vvvvvv.vv3.org/TR/SVG11/feature/ESVG-animation", "http://vvvvvv.vv3.org/TR/ 
SVG11/feature£SVG-dynamic" or "http://vvvvvv.vv3.org/ TR/SVG11/featureFSVGDOM". (Because the feature 
string "http://vvvvvv.vv3.org/TR/SVG11/feature/SVG" can be ambiguous in some circumstances, it is 
recommended that more specific feature strings be used.) 


Feature String: 
http://vvvvvv.vv3.org/TR/SVG11/featureFSVGDOM 

User Agent Supporits: 
At least one of the follovving (all of vvhich are deseribed subsequently): "http://vvvvvv.vv3.org/ TR/SVG11/ 
featureFSVGDOM-static", "http://vvvvvv.vv3.org/TR/SVG11/featureFSVGDOM-animation" or 
"http://vvvvvv.vv3.org/TR/SVG11/featuresSVGDOM-dynamic". (Because the feature string 
"http://vvvvvv.vv3.org/ TR/SVG11/featureESVGDOM" can be ambiguous in some circumstances, it is 
recommended that more specific feature strings be used.) 
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Feature Siring: 
http://vrvvvv.vv3.org/TR/SVG11/featuresSVG-static 
User Agent Supporits: 
"The follovving features (deseribed belovv) 


ə http://vvvvvv.vv3.org/ TR/SVG11/feature/CoreAttribute 

ə http://vvvvvv.vv3.org/TR/SVG11/feature/Structure 

ə http://vvvvvv.vv3.org/ TR/SVG11/feature/ContainerA ttribute 
e http://vvvvvv.vv3.org/ TR/SVG11/feature/ConditionalProcessing 
ə http://vvvvvv.vv3.org/ TR/SVG11/featureiTmage 

ə http://vvvvvv.vv3.org/ TR/SVG11/feature" Style 

ə http://vvvvvv.vv3.org/ TR/SVG11/feature/VievvportAttribute 
ə http://vvvvvv.vv3.org/ TR/SVG11/feature/Shape 

ə http://vvvvvv.vv3.org/ TR/SVG11/feature/Text 

ə http://vvvvvv.vv3.org/ TR/SVG11/feature"PaintAttribute 

ə http://vvvvvv.vv3.org/TR/SVG11/featureFZOpacityAttribute 

e http://vvvvvv.vv3.org/ TR/SVG11/feature/GraphicsAttribute 
e http://vvvvvv.vv3.org/ TR/SVG11/featuresMarker 

ə http://vvvvvv.vv3.org/ TR/SVG11/feature/ColorProfile 

ə http://vvvvvv.vv3.org/ TR/SVG11/feature/Gradient 

e http://vvvvvv.vv3.org/ TR/SVG11/featuresPattern 

ə http://vvvvvv.vv3.org/ TR/SVG11/feature/(Clip 

ə http://vvvvvv.vv3.org/ TR/SVG11/featuresMask 

ə http://vvvvvv.vv3.org/ TR/SVG11/feature“Filter 

ə http://vvvvvv.vv3.org/ TR/SVG11/feature/XlinkAttribute 

ə http://vvvvvv.vv3.org/ TR/SVG11/feature/Font 

ə http://vvvvvv.vv3.org/ TR/SVG11/feature"Extensibility 


For SVG vievvers, "http://vvvvvv.vv3.org/ TR/SVG11/featuresSVG-static" indicates that the vievver can process 
and render successfully all of the language features corresponding to the feature strings listed above. 


Feature String: 
http://vrvvvv.vv3.org/ TR/SVG11/featuresSVGDOM-static 

User Agent Supporis: 
AİI of the DOM interfaces and methods that correspond to the language features for "http:/ /v/VVVv.VV3.oTg/ 
TR/SVG11/feature/SVG-static", 


Feature String: 
http://vvvvvv.vv3.org/TR/SVG11/featuresSVG-animation 

User Agent Supporis: 
AII of the language features from "http://vvvvvv.vv3.org/ TR/SVG11/feature/SVG-static" plus the feature 
"http://vvvvvv.vv3.org/ TR/SVG11/featurezAnimation". For SVG vievvers running on media capable of 
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rendering time-based material, such as displays, "http://vvvvvv.vv3.org/ TR/SVG11/featureF/SVG-animation" 
indicates that the vievver can process and render successfully all of the corresponding language features. 


Feature String: 
http://vrvvvv.vv3.org/ TR/SVG11/featuresSVGDOM-animation 

User Agent Supporis: 
AlI of the DOM interfaces and methods that correspond to the language features for "http:/ /V/VVVV.VV3.oTg/ 
TR/SVG11/feature/SVG-animation". 


Feature String: 
http://vvvvvv.vv3.org/TR/SVG11/featuresSVG-dynamic 

User Agent Supporits: 
AlI of the language features from "http:/ /vrvvvv.vv3.org/TR/SVG11/featuresSVG-animation" plus the 
follovving features: 


ə http://vvvvvv.vv3.org/ TR/SVG11/featuresHyperlinking 

e http://vvvvvv.vv3.org/ TR/SVG11/feature/"Seripting 

e http://vvvvvv.vv3.org/ TR/SVG11/feature/Vievv 

ə http://vvvvvv.vv3.org/ TR/SVG11/featureiCursor 

e http://vvvvvv.vv3.org/ TR/SVG11/featuresGraphicalEventsAttribute 
ə http://vvvvvv.vv3.org/ TR/SVG11/featurezDocumentEventsA ttribute 
ə http://vvvvvv.vv3.org/ TR/SVG11/featureFAnimationEventsAttribute 


For SVG vievvers running on media capable of rendering time-based material, such as displays, 
"http://vvvvvv.vv3.org/TR/SVG11/featuresSVG-dynamic" indicates that the vievver can process and render 
successfully all of the corresponding language features. 


Feature String: 
http://vvvvvv.vv3.org/ TR/SVG11/featuresSVGDOM-dynamic 

User Agent Supporis: 
AlI of the DOM interfaces and methods that correspond to the language features for "http:/ /V/VVVv.VV3.oTg/ 
TR/SVG11/feature/SVG-dynamic". 


Feature Siring: 
http://vvvrvv.vv3.org/TR/SVG11/featureiCoreAttribute 
User Agent Supporis: 
the “id”, “xml:base”, “xml:lang” and “xml:space” attributes 


Feature String: 
http://vvvvvv.vv3.org/TR/SVG11/featuresStructure 
User Agent Supporis: 
“svg”, “g”, “defs”, “desc”, “title”, “metadata”, “symbol” and “use” elements 


Feature Siring: 
http://vvvvvv.vv3.org/TR/SVG11/featureFBasicStructure 
User Agent Supporits: 


9: 6 


“svg”, “g,, “defs”, “desc”, “title”, “metadata” and “use” elements 
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Feature String: 
http://vvvvvv.vv3.org/TR/SVG11/feature/ContainerAttribute 
User Agent Supporis: 
the “enable-background” property 


Feature String: 
http://vvvvvv.vv3.org/TR/SVG11/feature"ConditionalProcessing 
User Agent Supporis: 
the “svvitch” element, and the “requiredFeatures”, “requiredExtensions” and “systemLanguage” attributes 





Feature Siring: 

http://vrvvvv.vv3.org/ TR/SVG11/featurezlmage 
User Agent Supporis: 

the “image” element 


Feature String: 
http://vrvvvv.vv3.org/TR/SVG11/featuresStyle 
User Agent Supporis: 
the “style” element 


Feature String: 
http://vvvvvv.vv3.org/TR/SVG11/feature/VievvportAttribute 
User Agent Supporis: 
the “clip” and “overflovr” properties 


Feature String: 
http://vvvrvv.vv3.org/ TR/SVG11/featuresShape 
User Agent Supporits: 
the “rect”, “circle”, “line”, “polyline”, “polygon”, “ellipse” and “path” elements 


Feature String: 
http://vvvvvv.vv3.org/ TR/SVG11/featureFText 
User Agent Supporits: 
the “text”, “ispan”, “tref”, “textPath”, “altGiyph”, “altGiyphDef”, “altGlyphTtem” and “giyphRef” elements 


Feature String: 
http://vvvvvv.vv3.org/ TR/SVG11/feature/BasicText 
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User Agent Supporits: 
the “text” element 


Feature String: 
http://vvvvvv.vv3.org/TR/SVG11/featuresPaintAttribute 
User Agent Supporis: 
the “color”, “Til”, “fil-rule”, “stroke”, “stroke-dasharray”, “stroke-dashoffset”, “stroke-linecap”, “stroke-line/oin”, 


“stroke-miterlimit”, “stroke-vvidth”, “color-interpolation” and “color-rendering” properties 


Feature Siring: 
http://vvvvvv.vv3.org/ TR/SVG11/featuresBasicPaintAttribute 
User Agent Supporits: 
the “color”, “ill”, “fil-rule”, “stroke”, “stroke-dasharray”, “stroke-dashoffset”, “stroke-linecap”, “stroke-line/oin”, 


“stroke-miterlimit”, “stroke-vvidih” and “color-rendering” properties 


Feature String: 
http://vvvvvv.vv3.org/TR/SVG11/featurezOpacityAttribute 
User Agent Supporis: 
the “opacity”, “stroke-opacity” and “fill-opacity” properties 


Feature String: 
http://vvvvvv.vv3.org/TR/SVG11/featuresGraphicsAttribute 
User Agent Supporis: 
the “display”, “image-rendering”, “pointer-events”, “shape-rendering”, “text-rendering” and “visibility” properties 


Feature String: 
http://vvvvvv.vv3.org/TR/SVG11/featuresBasicGraphicsAttribute 
User Agent Supporis: 
the “display” and “visibility” properties 


Feature String: 
http://vvvvvv.vv3.org/TR/SVG11/featurezMarker 
User Agent Supporis: 
the “marker” element 


Feature String: 
http://vvvvvv.vv3.org/TR/SVG11/featuresColorProfile 
User Agent Supporis: 
the “color-profile” element 


Feature Siring: 
http://vvvvvv.vv3.org/TR/SVG11/featurezGradient 
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User Agent Supporis: 
the “linearGradient”, “radialGradient” and “stop” elements 


Feature Siring: 

http://vvvvvv.vv3.org/ TR/SVG11/featuresPattern 
User Agent Supporits: 

the “pattern” element 


Feature String: 
http://vvvvvv.vv3.org/TR/SVG11/feature£Clip 
User Agent Supporis: 
the “clipPath” element and the “clip-path” and “clip-rule” properties 


Feature String: 
http://vvvvvv.vv3.org/TR/SVG11/featureFBasicClip 
User Agent Supporis: 
the “clipPath” element and the “clip-path” property 


Feature Siring: 

http://vvvvvv.vv3.org/ TR/SVG11/featurezMask 
User Agent Supporits: 

the “mask” element 


Feature String: 
http://vvvvvv.vv3.org/TR/SVG11/featuresFilter 

User Agent Supporis: 
the “filter”, feBlend”, “feColorMatrix”, “feComponentTransfer”, “feComposite”, “feConvolveMatrix”, 
“TeDiffuseLighting”, feDisplacementMap”, “feFlood”, “feGaussianBlur”, “felmage”, “feMerge”, “feMergeNode”, 
“feMorphology”, “feOffset”, “feSpecularLighting”, “feTile”, feDistantLight”, “fePointLight”, “TeSpotLight, 
“feFuncR”, feFunceG”, “feFuncB” and “feFuncA” elements 


Feature String: 
http://vvvvvv.vv3.org/TR/SVG11/feature"BasicFilter 

User Agent Supporits: 
the “filter”, feBlend”, “feColorMatrix”, “feComponentTransfer”, “feComposite”, TeFlood”, “feGaussianBlur, 
“Telmage”, feMerge”, “feMergeNode”, “feOffset”, “feTile”, “feFuncR”, “feFuncG”, “feFuncB” and “feFuncA” elements 


Feature String: 
http://vvvvvv.vv3.org/ TR/SVG11/featurezDocumentEventsAttribute 
User Agent Supporis: 
the “onunload”, “onabort”, “onerror”, “onresize”, “onscroll” and “onzoom: attributes 


Feature Siring: 
http://vvvvvv.vv3.org/TR/SVG11/featureiGraphicalEventsAttribute 
User Agent Supporis: 
the “onfocusin”, “onfocusout”, “onactivate”, “onclick”, “onmousedovvn”, “onmouseup”, “onmouseover, 
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“onmousemove”, “onmouseout” and “onload” attributes 


Feature Siring: 
http://vvvvvv.vv3.org/TR/SVG11/featureFAnimationEventsAttribute 
User Agent Supporits: 
the “onbegin”, “onend”, “onrepeat” and “onload” attributes 


Feature String: 
http://vvvvvv.vv3.org/TR/SVG11/featurePCursor 
User Agent Supporits: 
the “cursor” element 





Feature String: 
http://vvvvvv.vv3.org/TR/SVG11/featurezHyperlinking 
User Agent Supporis: 
the “a” element 


Feature String: 
http://vvvvvv.vv3.org/TR/SVG11/featureFXlinkAttribute 
User Agent Supporis: 
the “xlink:type”, “xlink:href”, “xlink-role”, “xlink:arerole”, “xlink:title”, “xlink:shovv” and “xlink:actuate” attributes 


Feature String: 

http://vvvvvv.vv3.org/ TR/SVG11/featuresExternalResourcesRequired 
User Agent Supporis: 

the “externalResourcesRequired” attribute 


Feature String: 

http://vvvvvv.vv3.org/ TR/SVG11/feature/Vievv 
User Agent Supporis: 

the “vievv” element 


Feature String: 
http://vvvvvv.vv3.org/TR/SVG11/featuresSeript 
User Agent Supporits: 
the “seript” element 


Feature Siring: 
http://vvvvvv.vv3.org/TR/SVG11/featurezAnimation 
User Agent Supporis: 
the “animate”, “set”, “animateMotion”, “animateTransform”, “animateColor” and “mpath” elements 
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Feature Siring: 
http://vvvvvv.vv3.org/ TR/SVG11/feature/Font 
User Agent Supporits: 
the “font”, Tont-face”, “glyph”, “missing-giyph”, “hkern”, “vkern”, “font-face-src”, “font-face-uri”, “font-face-format” 


and “font-face-name” elements 


Feature String: 
http://vvvvvv.vv3.org/ TR/SVG11/feature/BasicFont 
User Agent Supporits: 
the “font”, font-face”, “glyph”, “missing-giyph”, “hkern”, “font-face-src” and “font-face-name” elements 





Feature String: 
http://vvvvvv.vv3.org/TR/SVG11/feature"Extensibility 
User Agent Supporits: 
the “foreignObiect” element 


O.3 SVC 140 feature sitrings 


AII SVG 1.0 İSVG10) feature strings referring to language capabilities begin vvith "org.vv3c.svg". AİI SVG 1.0 fea- 
ture strings referring to SVG DOM capabilities begin vvith "org.vv3c.dom.svg". 


e "The feature string "org.vv3c.svg" indicates that the user agent supporis at least one of the follovving (all of 
vvhich are described subsequently): "org.vv3c.svg.static", "org.vv3c.svg.animation", "org.vv3c.svg.dynamic" 
or "org.vv3c.dom.svg". (Because the feature string "org.vv3c.svg" can be ambiguous in some circumstances, 
it is recommended that more specific feature strings be used.) 

e "The feature string "org.vv3c.dom.svg" indicates that the user agent supporis at least one of the follovving 
(all of vvhicdh are deseribed subsequently): "org.vv3c.dom.svg.static", "org.vv3c.dom.svg.animation" or 
"org.vv3c.dom.svg.dynamic". (Because the feature string "org.vv3c.dom.svg" can be ambiguous in some cir- 
cumstances, it is recommended that more specific feature strings be used.) 

e "The feature string "org.vv3c.svg.static" indicates the availability of all of the language capabilities defined in: 

o Basic Data Types and Interfaces 

o Document Structure 

o Styling 

o Coordinate Systems, Transformations and Units 
o Paths 

o Basic Shapes 

o Text 
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o Painting: Filling, Stroking and Marker Symbols 

o Color 

o Gradients and Patterns 

o Clipping, Masking and Compositing 

o Filter Effects 

o YFonts 

o “İhe “svvitdhi” element 

o "The “requiredFeatures” attribute 

o "The “requiredExtensions” attribute 

o "The “systemLanguage” attribute 
For SVG vievvers, "org.vv3c.svg.static" indicates that the vievver can process and render successfully all of 
the language features listed above. 
The feature string "org.vv3c.dom.svg.static" indicates the availability of all of the DOM interfaces and meth- 
ods that correspond to the language features for "org.vv3c.svg.static". 
The feature string "org.vv3c.svg.animation" includes all of the language capabilities defined for 
"org.vv3c.svg.static" plus the availability of all of the language capabilities defined in Animation. For 
SVG vievvers running on media capable of rendering time-based material, such as displays, 
"org.v/3c.svg.animation" indicates that the vievver can process and render successfully all of the correspond- 
ing language features. 
The feature string "org.vr3c.dom.svg.animation" corresponds to the availability of DOM interfaces and 
methods that correspond to the language features for "org.vv3c.svg.animation". 
The feature string "org.vv3c.svg.dynamic" includes all of the language capabilities defined for 
"org.vv3c.svg.animation" plus the availability of all of the language capabilities defined in Relationship vvith 
DOM2 events, Linking and Tnteractivity and Seripting. For SVG vievvers running on media capable of render- 
ing time-based material, such as displays, "org.vv3c.svg.dynamic" indicates that the vievver can process and 
render successfully all of the corresponding language features. 
The feature string "org.vv3c.dom.svg.dynamic" corresponds to the availability of DOM interfaces and meth- 
ods that correspond to the language features for "org.vv3c.svg.dynamic". 
The feature string "org.vv3c.svg.all" corresponds to the availability of all of the language capabilities defined 
in this specification. 
The feature string "org.vv3c.dom.svg.all" corresponds to the availability of all of the DOM interfaces defined 
in this specification. 


Appendix P: Media Type Registration for image/ 
svg-rxml 
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Contents 


P.1 Imntroduction 
P.2 Registration of media type image/svg:xml 


This appendix is normative. 





P.1 İntroduction 


"This appendix registers a nevv MIME media type, "image/svgixml" in conformance vvith BCP 13 and VV3CRegMe- 
dia. 


P.2 Registration of media type image/svg-rxml 


Type name: 
image 
Subtype name: 
svgixml 
Required parameters: 
None. 
Optional parameters: 
charset 
Same as application/xml media type, as specifted in İRFC3023) or its successors. 
Encoding considerations: 
Same as for application/xml. See İRFC3023), section 3.2 or its successors. 
Security considerations: 
As vvith other XML types and as noted in İRFC3023) section 10, repeated expansion of maliciously construc- 
ted XML entities can be used to consume large amounts of memory, vvhich may cause XML processors in 
constrained environments to fail. 

Several SVG elements may cause arbitrary URİls to be referenced. In this case, the security issues of 
IRFC3986), section 7, should be considered. 

Im common vvith HTML, SVG documents may reference external media such as images, audio, video, 
style sheets, and scripting languages. Scripting languages are executable content. In this case, the security 
considerations in the Media Type registrations for those formats shall apply. 

In addition, because of the extensibility features for SVG and of XML in general, it is possible that "im- 
age/svgexml" may describe content that has security implications beyond those described here. Hovvever, if 
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the processor follovvs only the normative semantics of the published specification, this content vvill be out- 
side the SVG namespace and shall be ignored. Only in the case vvhere the processor recognizes and processes 
the additional content, or vvhere further processing of that content is dispatched to other processors, vvould 
security issues potentially arise. And in that case, they vvould fall outside the domain of this registration 
document. 
Imteroperability considerations: 

The published specification describes processing semantics that dictate behavior that must be follovved vvhen 
dealing vvith, among other things, unrecognized elements and attributes, both in the SVG namespace and in 
other namespaces. 

Because SVG is extensible, conformant "image/svg:xml" processors must expect that content received 
is vvell-formed XML, but it cannot be guaranteed that the content is valid to a particular DTD or Schema or 
that the processor vvill recognize all of the elements and attributes in the document. 

SVG has a published Test Suite and associated implementation report shovving vvhich implementations 
passed vvhich tests at the time of the report. This information is periodically updated as nevv tests are added 
or as implementations improve. 

Published specification: 
"This media type registration is extracted from Appendix P of the SVG 1.1 specification. 
Applications that use this media type: 
SVG is used by VVeb brovvsers, often in conyunction vvith HTML, by mobile phones and digital cameras, as a 
format for interchange of graphical assets in desk top publishing, for industrial process visualization, display 
signage, and many other applications vvhich require scalable static or interactive graphical capability. 
Additional information: 


Magic number(s): 
File extension(s): 
SVg 
Note that the extension "svgz" is used as an alias for "svg.gz" £RFC1952), i.e. octet streams of type image/ 
svgexml, subsequently compressed vvith gzip. 
Macintosh file type code(s): 
"svg " (all lovvercase, vvith a space character as the fourth letter). 
Note that the Macintosh file type code "svez" (all Tovvercase) is used as an alias for GZİP fRFC1952) 
compressed "svg ", i.e. octet streams of type image/svg-ixml, subsequently compressed vvith gzip. 
Macintosh Universal Type ldentifier code: 
org.v/3c. svg conforms to public.image and to public.xml 
VVindovvs Clipboard Name: 
"SVG Image" 
Fragment Identifiers 
For documents labeled as application/svgixml, the fragment identifter notation is either Shorthand 
Pointers (formerly called barenames) or the SVG-specific SVG Vievvs syntax: both deseribed in the frag- 
ment identifters section of the SVG specification. 


Person ör email address to contact for further information: 
Chris Lilley, Doug Schepers (member-svg-media-type(9vv3.org). 
Imtended usage: 
COMMON 
Restrictions on usage: 
None 
Author: 
"The SVG specification is a vvork product of the VVorld VVide VVeb Consortium"s SVG VVorking Group. 
Change controller: 
"The VV3C has change control over this specification. 
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Appendix Q: Changes 


This appendix is informative, not normative. 
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"The only changes made to the document since the SVG 1.1 Second Edition Proposed Recommendation vvere the 
follovving: 


e Some additional vvording in the CSS 2.0 reference in the References Appendix to indicate that future versions 
of the SVG specification vvill reference CSS 2.1 and CSS Fonts Module Level 3. 
e An update to the informative MathML reference from MathML 2.0 to MathML 3.0. 





